Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • August 9, 2018 at 3:01 pm #995509
    Papster

    Hi,
    I have been trying to set a background image for main content pages and the Shop/ Product page.
    For the pages I figured I can set the background in a color section as background image which works but is not a great solution. Initially I tried adding the background trough CSS trick I found here but nothing seems to work.
    For the shop page I added some CSS code which seems to publish the image but this is covered by the product grid that has a white background. Image is still visible in sidebar before getting cut of by product grid background.

    I imagine, if I could get the product grid background transparent, my background image would be visible.
    Could you please help me out with a selector for shop product grid background or a better solution for both pages and woo endpoints?
    credentials attached in private content

    Thank you!

    • This topic was modified 6 years, 3 months ago by Papster.
    August 9, 2018 at 3:55 pm #995547
    Victoria

    Hey Papster,

    Using the background image will distract users from your pretty bottles and will make the small text hardly readable. Having a nice image on top like you have and white background for the grid is looking good.

    If you really insist, we can try to help you to set the background image though.

    Best regards,
    Victoria

    August 9, 2018 at 4:25 pm #995575
    Papster

    I get what you mean but on client’s request I must insert the background image aligned center left on no repeat.
    Similar to as you see on the front page but better. I still did not figure out how to make the product grid background transparent nor how to insert background image in regular page.
    If you could give me a good css selector, that would take me a long way.

    August 9, 2018 at 9:31 pm #995728
    Basilis

    Hi,

    Unfortunately, it would require quite some time and customization of the theme to achieve this, so I am sorry to tell you that this is not covered by our support. However, if it’s really important for you to get this done, you can always hire a freelancer to do the job for you :)

    Best regards,
    Basilis

    August 10, 2018 at 8:41 am #995852
    Papster

    Those aren’t good news but I understand that it is styling related..
    Can we switch to a technical issue then?

    I have a page where I need to display our portfolio items. The portfolio items in this case are wine houses from different countries.
    Enfold product grid filter is quiet limited so I have decided to put each separate portfolio category in a separate tab of the theme integrated tabs element.
    As you know you can’t drag a portfolio grid in the tabs element but I managed to copy shortcodes with the corresponding category id in it.
    This seems to be a good solution BUT when i navigate from tab to tab the margin between portfolio items seems to not be fixed. They kind of float around to sometimes be cut of half by some invisible right side/bar. If I stretch or shrink the browser width just a little it all jumps back to normal with a margin of 10 in between grid elements.

    You can test this with Argentinie, Chili and Spanje.
    I tried fiddling around with the grid width but no success and it is just a bizar occurrence.
    Please let me know how I can handle this issue?

    I will provide the page in the private section.

    • This reply was modified 6 years, 3 months ago by Papster.
    August 13, 2018 at 10:57 am #996613
    Dude

    Hi,

    The tabs do not support portfolio grids out of the box. However I could fix the alignment by adding this code to the theme functions.php:

    

function avia_custom_head_javascript() {
    ?>
        <script>
  		setTimeout(function(){
              		setInterval(function() {
				jQuery('.tab_content .isotope').isotope({
					layoutMode : 'fitRows', itemSelector : '.flex_column'
				});
               		}, 800);
             	}, 800);
        </script>
    <?php
}
add_action('wp_head', 'avia_custom_head_javascript');

    Best regards,
    Dude

    August 13, 2018 at 11:26 am #996620
    Papster

    Thank you for the fix! This seems fine but not sure if accepted by my client. As it would be nice if you just have the grid load with the proper margins instead of having the effect of elements being pulled together.
    If I find a better solution I will share and please do so too if you find a better one.

    August 13, 2018 at 3:14 pm #996724
    Dude

    Hi,

    You can replace 800 (the first occurence of this value) with a lower value – this may reduce or remove this effect.

    Best regards,
    Dude

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.