Looking to place a graphic on the same line/row as an h3 title like this:
<h3 style="display:inline;">Graphic Advantage</h3><img style="max-width: 50px; width: 100%;" src="https://sgdesign.com/images/SGDadvantage.png" alt="SGD Advantage" />
First I make the h3 display = inline so it only occupies it's actual width rather than the full row. I could float the h3 and the graphic left and then do a clearfix but it seems excessive. The goal is to simply place both the h3 and small graphic on the same line.
It fails because of Wordpresses auto formatting function wpautop() which sets automatically, a paragraph tag < p >
But yet this works when the secondary content (graphic) is wrapped in a shortcode:
<h3 style="display: inline;">Advantage SGDesign</h3>
[tooltip text="Throughout our site you'll see this icon that will help identify significant differences between SGDesign and other companies"]<img style="max-width: 50px; width: 100%;" src="https://sgdesign.com/images/SGDadvantage.png" alt="SGD Advantage" />[/tooltip]
QUESTION: Best practice to thwart the wpautop() function within a wrapped tag of some type?
Maybe creating a null shortcode like
function no_wp_autoformat_shortcode() {
return null;
}
add_shortcode('nowpautop', 'no_wp_autoformat_shortcode');
This will work but now it hides the wrapped < img ...
So the question changes to how to make an image show when wrapped by a Shortcode ?
<h3 style="display:inline;">Graphic Advantage</h3>[nowpautop]<img style="max-width: 50px; width: 100%;" src="https://sgdesign.com/images/SGDadvantage.png" alt="SGD Advantage" />[/nowpautop]
See Question&Answers more detail:
os 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…