Portfolio widget

Home Forums Ample Free Portfolio widget

This topic contains 8 replies, has 3 voices, and was last updated by  Derek 11 months, 3 weeks ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #1387321

    Derek
    Participant

    Hi,

    I am testing Ample free for a new site before buying the pro version. Just one issue I have noticed.

    It’s that when I select the fixed option for the portfolio widget, the scrolling effect over the background image works fine on desktop but not on mobile. On mobile is it just a blurred image. But if I select scroll, both versions work fine.

    Can you assist?

    #1387400

    Ashish
    Moderator

    Hi Derek
    Do you mean the background image of portfolio section of homepage? If so, can you provide your site URL so that I could check and find a solution for you.

    Regards,
    ThemeGrill Support Team.

    #1387414

    Derek
    Participant

    Thanks for getting back to me Ashish.

    Yes, the problem is with the background image of the portfolio widget.

    Here is the link to the test site homepage.

    Home Page

    #1387537

    Ashish
    Moderator

    @Derek
    While checking your site on mobile device, I couldn’t find issue as you mentioned: On mobile is it just a blurred image. Can you explain it to clear my confusion? Or provide screenshot of the issue here. Thanks.

    #1387556

    Derek
    Participant

    Here are two screenshots for mobile and desktop.

    screenshots

    #1387680

    Ashish
    Moderator

    Hi Derek
    Now I understand. 🙂
    You can add following code inside Appearance > Customize > Additional CSS :

    
    @media screen and ( max-width: 768px ) {
        .portfolio-container {
            background-size: contain !important;
            background-repeat: repeat-y !important;
        }
    }
    

    I hope this works for you, if not let me know. Also, if you like our theme, you can help us by providing a review us here: https://wordpress.org/support/theme/ample/reviews/?filter=5

    Thanks.

    #1387713

    Derek
    Participant

    Hi Ashish,

    Thanks for the CSS. I tried it, and it is half successful. The image isn’t blurred now, but there is no movement of the portfolio pages over the background image on mobile like there is on a desktop.

    My plan for this site is to use the one page set up using the pro version of Ample, so I really want to be sure that all the parallax functions will work on mobile.

    That’s why I have been testing with this widget.

    Is it possible to get the same result on mobile as on desktop with this theme?

    #1387825

    Nilan
    Moderator

    Hi Derek,

    Can you replace previously provided CSS code by the following code?

    @media screen and ( max-width: 768px ) {
        .portfolio-container {
            background-position: center center;
        }
    }

    By setting background-position to Cover, it covers the entire region of the container. No matter what size the container is, the image will try to cover it with changing its height or width. This may result in the elongated background image on the mobile device as the container’s height increases.

    Regards,
    ThemeGrill Support

    #1387871

    Derek
    Participant

    Thanks Nilan,

    I tried the CSS, but it is still the same. A blurred background.

    So it seems to me that this theme is not practical for mobile. I’ll have to look for an alternative.

    I’m using Themegrill pro theme versions on all my sites, so I’ll try a different theme.

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.