Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • February 28, 2023 at 5:14 am #1399466
    bemodesign

    Can I get separate CSS for the Caption Text and the Link Buttons?

    I used this for the Caption Title:
    .avia_transform .av_slideshow_full .active-slide .avia-caption-title,
    .avia_transform .av_fullscreen .active-slide .avia-caption-title
    {text-shadow: 3px 3px 2px #000;}

    February 28, 2023 at 5:57 am #1399468
    bemodesign

    And is there a way to also add Drop shadow to H1 headlines on specific pages, like in the headline on the attached page:

    February 28, 2023 at 8:31 am #1399485
    Ismael

    Hi,

    Thank you for the inquiry.

    You can use this css code to adjust the style of the slideshow buttons.

    #top .avia-slideshow-button {
    border-radius: 3px;
    text-transform: uppercase;
    padding: 15px 16px;
    display: inline-block;
    margin-top: 20px;
    text-decoration: none;
    font-weight: bold;
}

#top .avia-button.avia-color-orange, #top .avia-button.avia-color-orange:hover {
    background-color: #edae44;
    border-color: #CA9336;
    color: #fff;
}

#top .avia-slideshow-button.avia-color-light {
    padding: 12px 16px;
    background-color: rgba(0,0,0,0.2);
}

    For the special heading, this css should work.

    .av-special-heading.av-nlr5x-bb365aeef7c91c871c871ed41100301d h1 {
    text-shadow: 2px 2px black;
}

    You may noticed that we used the unique class name of the special heading element in the css code above.

    Best regards,
    Ismael

    February 28, 2023 at 11:24 pm #1399586
    bemodesign

    1. That code didn’t work for for the Caption Text and the Link Buttons. Is there something missing?

    2. The code for the “special Hading” worked, but only on that specific page. How can I do this for other pages and also the “subheading text”?

    March 1, 2023 at 8:49 am #1399618
    Ismael

    Hi,

    Thank you for the inquiry.

    1.) You have to adjust the color and background color values in the css rule. The values are the same as the current styles, which is why you are not seeing any difference.

    2.) To apply the style to other special heading elements, just remove the unique element ID or class name in the css. 

    .av-special-heading h1 {
    text-shadow: 2px 2px black;
}

    Best regards,
    Ismael

    March 1, 2023 at 10:12 pm #1399731
    bemodesign

    Ok, just need 2 things:

    1. CSS to add “Text Shadows” for the “Caption Text” on the Fullwidth Easy Slider.

    2. CSS to add “Text Shadows” for the “Subheading Text” that is under the H1 heading.

    March 2, 2023 at 9:43 am #1399770
    Ismael

    Hi,

    For the slider caption text.

    #top .avia-slideshow .av-slideshow-caption .avia-caption-content p {
    text-shadow: 2px 2px black;
}

    And for the subheading text.

    #top .av-subheading p {
    text-shadow: 2px 2px black;
}

    Best regards,
    Ismael

    March 2, 2023 at 8:12 pm #1399893
    bemodesign

    Your awesome!
    For this code below, how do I make it for specific pages only? Like if the page is “post=149′?

    .av-special-heading.av-nlr5x-bb365aeef7c91c871c871ed41100301d h1 {
    text-shadow: 2px 2px black;
    }

    March 3, 2023 at 4:14 am #1399926
    Nikko

    Hi bemodesign,

    The CSS class you are using seems already specific, however if you really want to target the page/post as well then:

    If it’s a page, then it will have this unique id in the body page-id-25 (where 25 is page id number), so you can set it specifically like this:

    .page-id-25 .av-special-heading.av-nlr5x-bb365aeef7c91c871c871ed41100301d h1 {
    text-shadow: 2px 2px black;
}

    If it’s a post then you can use .single-post.postid-15 (where 15 is the post id number):

    .single-post.postid-15 .av-special-heading.av-nlr5x-bb365aeef7c91c871c871ed41100301d h1 {
    text-shadow: 2px 2px black;
}

    Hope it helps.

    Best regards,
    Nikko

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