Before/After text change in only one instance of use

Comments

• Phil

  September 2021

  Hi,

  Please always attach a link to your website so we can check it out. If the page is offline(localhost), then our help will be limited. You will have to contact us when the page is online. Also, please make sure that the page is not under maintenance before you provide us the link.

  It is always a good idea to also attach a screenshot showing what you want to change and achieve.

  Thanks

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• DebsWebs

  September 2021

  I just need to change the word Before and the word After in the hover text on the Before/After shortcode. I have currently set it to not show any words by putting a blank in the CSS code.

  .twentytwenty-before-label::before {

    content: "";

  }

  .twentytwenty-after-label::before {

    content: "";

  }

  We are not quite sure exactly what we want to change the text to, but it can't say Before and After when hovered. I figured out how to change the text for all of the instances of the Before/After shortcode, but now I need to customize only one instance of that shortcode. All of the other instances of the Before/After shortcode still need to say Before/After. I also found the shortcode code in the php files, but I am unsure if duplicating that and editing it will work in conjunction with CSS changes. Please point me in the right direction.

  Here's a link to the page: https://www.s-g-marine.com/media-campaign, and the Before/After in question.

  

  
  

  Thanks for your help.
• Phil

  September 2021

  To do that, you can add a class to this particular Before After item, and wrote a special CSS for this class.

  Check the following screenshot for a better understanding

  

  

  .noBefAft .twentytwenty-before-label::before,
  .noBefAft .twentytwenty-after-label::before {
   content: ""!important;
  }
  

  Thanks

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• DebsWebs

  September 2021

  Thank you so much! This is perfect!!! I was super close to getting it right on my own. I basically only needed to switch the special class to in front of the .twentytwenty.... and add the !important at the end. Otherwise I had it right.

  Thanks for the awesome support! My client will be SO happy.
• Phil

  September 2021

  I am glad that I could help, and thanks for your kind words.

  If I can help you with anything else, please, let me know.

  
  

  Thanks

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next