Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • July 31, 2017 at 7:47 pm #832373
    afarahani

    Hi
    Many enfold elements don’t have custom ID field. For example I want to add custom ID to magazine element to add different heading background color to each element or I want to add background to a specific Special Heading and not all headings.
    Unfortunately Enfold is still need to get more improved to provide free styling opportunity from within each element without hassle of adding custom css.

    In the meantime, is there any way to activate custom ID field for various elements? or how can I style different of same without putting them inside a color section!

    thanks.

    July 31, 2017 at 8:09 pm #832384
    Yigit

    Hey afarahani!

    You can simply go to Enfold theme options > Layout Builder and check “Show element options for developers”. It will enable custom CSS field for ALB elements – http://kriesi.at/documentation/enfold/wp-content/uploads/sites/2/2013/12/blur.jpg. You can give your elements custom CSS classes to target them separately :)

    Best regards,
    Yigit

    July 31, 2017 at 9:21 pm #832431
    Guenni007

    if you are familiar with shortcode handling here on enfold and how to edit your own shortcode element – the id is one of the less complicated fields of input to create. The array is allways the same to implement and you only have to add some lines to $atts and $defaults and on output.

    But the magazine does have its own id allready so you can use the given id (av-magazine-1, …) – the only thing why this could be a good idea is to use it as anchor – adressing should go with class aswell.

    For example – i made me a custom hr.php because sometimes i use that whitespace hr to adress with an anchor. It gaves me the opportunity to shift the link a bit.

    July 31, 2017 at 9:53 pm #832452
    afarahani

    Nice tips thanks.

    July 31, 2017 at 11:43 pm #832505
    Yigit

    Hi,


    @Guenni007     Thanks for your input! :)

    Best regards,
    Yigit

    July 31, 2017 at 11:45 pm #832508
    afarahani

    @Yigit, do you know how I can change the top line color (under heading) of magazine element?

    • This reply was modified 7 years, 3 months ago by afarahani.
    July 31, 2017 at 11:50 pm #832513
    Yigit

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

    .av-magazine-hero-left .av-magazine-top-bar {
    border-color: orange;
}

    Best regards,
    Yigit

    August 1, 2017 at 12:31 am #832529
    afarahani

    Thanks Yigit. I combined yours with element id as follows and it worked:

    .mag_pd .av-magazine-top-bar {
    border-color: #83a846;
    border-bottom-width: 2px;
}

    I didn’t undrestand what the first part of your code was intended for?! (.av-magazine-hero-left )

    August 1, 2017 at 12:37 am #832530
    Yigit

    Hey!

    I took the selector from one of Enfold demos however it would work without it and it does :)
    Glad you figured it out! Let us know if you have any other questions or issues!

    Best regards,
    Yigit

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘adding custom ID to enfold elements’ is closed to new replies.