Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #382371

    Hi Enfold Team,

    I have contacted you guys before with the same issue and doing it again as I have not got any response form you yet with the issue.

    Details –
    What I am trying to do
    I am trying to implement a new homepage for our website, which is built on Enfold theme.

    The layour I have in mind is something like this –
    1. The header element and the navigation remain the same.
    2.Advanced Layer Slider in the main content area, then
    3.A Widget area for a Featured Post(within color section element)
    4. Three layers of Post Slider element (within color section element for each) for Investment, Trading, and Property Posts respectively.

    The Issue
    The page looks great until I have one layer of Post slider element (within a color section element). However, when I add the second and third layers of Post slider element ( within a color section element) the element Post Slider element snaps and in the second Layer I see a blue border around the images and the text and in the third layer I see a Blue Background for the images and the text.

    Troubleshooting steps I have considered –
    1. De-activated all the Plugins and checked the Page but the issue still remains. So, I am pretty sure the issue is not because of any Plugin but the theme.
    2. Tried to create the same scenario in an other space with no plugins at all but found the issue to be the same there as well.

    I request your to Please check the issue as soon as possible and update me with the same, as I am running on a very tight schedule for getting the page up.


    Hi hbjcapital!

    Thank you for using Enfold.

    You have this file called alter.js and some of the script applies backgrounds on section links:

    $(".avia-builder-el-4 a").css({"background":"#2d5c88","color":"#ffffff"});
    		$(".avia-builder-el-6 a").css({"background":"#ffffff","color":"#2d5c88","border-color":"#2d5c88","border-style":"solid","border-width":"1"});		
    		$(".avia-builder-el-7 a").css({"background":"#ffffff","color":"#2d5c88","border-color":"#2d5c88","border-style":"solid","border-width":"1"});
    		$(".avia-builder-el-9 a").css({"background":"#ffffff","color":"#2d5c88","border-color":"#2d5c88","border-style":"solid","border-width":"1"});

    You can’t use the “avia-builder-el” class attribute because this a default class which is widely use throughout the site and it can change depending on the number of elements inside a page. If you want to specify a custom class for each elements like buttons, post slider etc, you need to turn on the custom css class. Refer to this link:

    Best regards,

    This reply has been marked as private.


    Glad we could help. If you have any question, let us know.

    Best regards,

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Some Issue with the post slider element when used on a single page multiple time’ is closed to new replies.