Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • October 30, 2014 at 7:40 pm #343586
    brandworld

    Hello,
    Is it possible to add to the textbox an extra background picture, e.g. a black background with 50-60% opacity?
    I mean I would like to use it as an “extra layer”: the first layer is a background picture the second layer would be the text background and the third layer is the text. Like on this page: http://www.quilvest.com/ the text: “With approximately $27 billion…”

    – I tried to add a background to a text box, but there can be defined the text color only.
    – I tried to embed a color section in to an other color section but it is not possible.

    Thank you,
    Zsolt

    October 31, 2014 at 7:07 pm #344263
    Yigit

    Hey brandworld!

    Please firstly turn on custom CSS field for ALB elements – http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ and then give your text block elementa custom class and then add following code to Quick CSS in Enfold theme options under General Styling tab

    .avia_texblock.your-custom-class { background-color: rgba(0,0,0,0.5); }

    0,0,0 is the RGB value of the color and 0.5 is opacity level

    Best regards,
    Yigit

    November 7, 2014 at 12:36 pm #347683
    brandworld

    Hi Yigit,
    thank you for your answer.

    I followed your insturctions but it does not work for me.
    My steps were:
    01. Added the line
    add_theme_support(‘avia_template_builder_custom_css’);
    at the end to the functions-enfold.php file. (I use the photograpy demo style and the functions.php already existed this extra line.)

    It worked, the Custom CSS Class field appeared.

    02. Added to a text element the custom css class name: your-custom-class
    03. Addet this code to the quick css at the general styling.

    But nothing happened.
    The site is here: http://www.demotheme.carbonforexcentral.com/1-kezdje-itt/
    The text is the firs section with the begining “This text should have the extra css class…”

    November 8, 2014 at 12:37 pm #348128
    Ismael

    Hey!

    Thank you for the info.

    Are you sure that you added the code correctly on the Quick CSS field? I can’t see it being applied. Make sure that all your css codes are properly closed. Use this:

    .avia_textblock.your-custom-class {
background-color: rgba(0,0,0,.5);
padding: 10px;
}

    Cheers!
    Ismael

    November 10, 2014 at 4:16 pm #348833
    brandworld

    Hi,
    it works fine with the second version of the CSS!
    Thank you for your help.

    Zsolt

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Opacity background for texts’ is closed to new replies.