Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • August 18, 2018 at 6:47 pm #998740
    mrqslmk

    Hi,

    I’m using a timeline on my website. For SEO reasons, I want to achieve that the date is not automatically an H2, while the style might remain the way it is. How do I do that?

    Check: https://ml-digital.de/

    Thanks a lot in advance!
    Markus

    August 18, 2018 at 8:54 pm #998775
    Mike

    Hey mrqslmk,
    Try adding this code to the end of your functions.php file in Appearance > Editor:

    function custom_timeline(){
  ?>
  <script>
jQuery(window).load(function(){
jQuery('.av-milestone-even h2.av-milestone-date:nth-child(even)').replaceWith(function () {
    return $('<h3/>', {
        html: $(this).html()
    });
 });
jQuery('.av-milestone-odd h2.av-milestone-date:nth-child(odd)').replaceWith(function () {
    return $('<h3/>', {
        html: $(this).html()
    });
 });
 });
 </script>
 <?php
  }
  add_action('wp_footer', 'custom_timeline');

    Then add this code in the General Styling > Quick CSS field:

    
.avia-timeline h3 strong {
    color: #858585 !important; 
    font-size: 25px !important; 
}
.av-milestone-odd h3 strong {
float:right !important;
}

    Best regards,
    Mike

    August 19, 2018 at 1:06 pm #998903
    mrqslmk

    Hi Mike,

    thanks for your help. I just followed the steps you suggested, but it appears to me that it didn’t work. I left it that way on my site so you can check again. And: I’d prefer it not to be an H-headline at all. I think your code is supposed to make an H3 out of the H2 it was previously, right?

    Thank you for helping me – your support is great!

    August 19, 2018 at 2:35 pm #998917
    Mike

    Hi,
    I see you are getting this error: Uncaught ReferenceError: jQuery is not defined
    Can you please include a admin login in the private content area so we can take a closer look.
    I will change the H3 to a span, I assume you still want the text to be the same color and font size though?

    Best regards,
    Mike

    August 19, 2018 at 2:52 pm #998926
    mrqslmk

    Hi Mike,

    To be honest, I didn’t see that error. I just followed your list and then I checked on the frontend and could not see a difference. You’re right, I’d like to keep size, color etc., I just don’t want it to be tagged as an “Hx”.
    Thank you!

    August 19, 2018 at 3:40 pm #998931
    Mike

    Hi,
    Thank you for the login, I have changed the function and the css, now it is working correctly without any H tags.
    Please clear your browser cache and check.
    Here is the final code:
    functions.php:

     function custom_timeline(){
  ?>
  <script>
jQuery(window).load(function(){
jQuery('.av-milestone-even h2.av-milestone-date:nth-child(even)').replaceWith(function () {
    return jQuery('<span/>', {
        html: jQuery(this).html()
    });
 });
jQuery('.av-milestone-odd h2.av-milestone-date:nth-child(odd)').replaceWith(function () {
    return jQuery('<span/>', {
        html: jQuery(this).html()
    });
 });
 });
 </script>
 <?php
  }
  add_action('wp_footer', 'custom_timeline');

    CSS:

    .avia-timeline span strong {
    color: #858585 !important; 
    font-size: 25px !important; 
}
.av-milestone-odd span strong {
float:right !important;
}

    Best regards,
    Mike

    August 19, 2018 at 3:46 pm #998932
    mrqslmk

    Hi Mike,

    thank you, but on my end (and I did clear my browser cache) the “date” contents are still H2s?

    August 19, 2018 at 5:56 pm #999000
    Mike

    Hi,
    Ok, I made a few more changes, Please clear your browser cache and check.
    New final functions.php:

    function custom_timeline(){
  ?>
  <script>
jQuery(window).load(function(){
jQuery('.av-milestone h2.av-milestone-date').replaceWith(function () {
    return jQuery('<span/>', {
        html: jQuery(this).html()
    });
 });
 });
 </script>
 <?php
  }
  add_action('wp_footer', 'custom_timeline');

    New final CSS:

    .avia-timeline span strong {
    color: #858585 !important; 
    font-size: 25px !important; 
}
.av-milestone-odd span strong {
float:right !important;
}
.avia-timeline-vertical.av-milestone-placement-alternate li.av-milestone-even > span:first-child {
    display: none;
}

    Best regards,
    Mike

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