-
AuthorPosts
-
August 30, 2023 at 8:01 pm #1417610
Hi there!
Thank you very much for your support.
It is very easy, the icon/flipbox grid titles and sub-titles are by default H4 and H6. I would want to change titles to H2 and H3 and sub-title to paragraph. I leave an example of page where you can see an example.
Thank you vey much.
September 1, 2023 at 1:53 am #1417737Hey Xiscoj,
Please use the heading tag option to change the heading tag:
To change the subtitles to h3 you will need to ensure that you have jQuery enabled, it looks like you may have a caching plugin defuring it right now, then try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:function custom_icongrid_subtitle_script() { ?> <script> window.addEventListener('DOMContentLoaded', function() { (function($) { function replaceElementTag(targetSelector, newTagString) { $(targetSelector).each(function(){ var newElem = $(newTagString, {html: $(this).html()}); $.each(this.attributes, function() { newElem.attr(this.name, this.value); }); $(this).replaceWith(newElem); }); } replaceElementTag('h6.av_icongrid_subtitle', '<h3></h3>'); }(jQuery)); }); </script> <?php } add_action('wp_footer', 'custom_icongrid_subtitle_script');
Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
Best regards,
MikeSeptember 1, 2023 at 9:05 am #1417748Hi Mike,
Thank you! I did not find the option to change the title.
Although, I want to change the subtitles to P, paragraph, not titles. I tried to change it in your code but did not work, unfortunately.
Best,
FranciscoSeptember 1, 2023 at 12:37 pm #1417804Hi,
Please look at the screenshot above, the option is in each item under the advanced tab.
Sorry, I misunderstood, this is the way to make the script cange it to “p”function custom_icongrid_subtitle_script() { ?> <script> window.addEventListener('DOMContentLoaded', function() { (function($) { function replaceElementTag(targetSelector, newTagString) { $(targetSelector).each(function(){ var newElem = $(newTagString, {html: $(this).html()}); $.each(this.attributes, function() { newElem.attr(this.name, this.value); }); $(this).replaceWith(newElem); }); } replaceElementTag('h6.av_icongrid_subtitle', '<p></p>'); }(jQuery)); }); </script> <?php } add_action('wp_footer', 'custom_icongrid_subtitle_script');
it looks like you have added this correctly, please check your caching plugin options to see if it is defering javascript.
Otherwise try remove the script and try this one instead:function pure_js_change_icongrid_subtitle_tag() { ?> <script> document.querySelectorAll("h6.av_icongrid_subtitle").forEach(e=>e.parentNode.replaceChild(Object.assign(document.createElement("p"),{innerHTML:e.innerHTML}),e)); </script> <?php } add_action('wp_footer', 'pure_js_change_icongrid_subtitle_tag');
Best regards,
MikeSeptember 1, 2023 at 1:40 pm #1417809Hi again!
Thank you Mike, the second code worked perfectly, not the first one.
About the titles, it is just a previous comment, your screenshot was great.
thank you very much for your help!
You can close the thread
September 1, 2023 at 1:49 pm #1417814for subtitle there is a filter: avf_sc_icongrid_subtitle_heading_tag
sadly there is no filter for title_heading_tag – but you can solve that as you said – see screenshot of Mikebtw: maybe the first snippet of mike here: Link – does not work – because a priority is missing – when you load your jQuery in the footer ;)
using for last line then :… add_action('wp_footer', 'custom_icongrid_subtitle_script', 999);
-
AuthorPosts
- The topic ‘Icon/Flipbox Grid – Change H4 and H6 of Grid Item Title and Sub-title’ is closed to new replies.