I want to talk about using heading (h1 to h6) tags for designing purposes.
Beans uses the important tag for the very unimportant widget titles. That kills the heading structure and marks "Recent Posts" or "Archives" as importing content.
Use HTML headings for headings only. Don't use headings to make text BIG or bold. Search engines use your headings to index the structure and content of your web pages. Users skim your pages by its headings. It is important to use headings to show the document structure. h1 headings should be main headings, followed by h2 headings, then the less important h3, and so on.
from http://www.w3schools.com/html/html_headings.asp
I know that WordPress does the same thing in the default themes. But maybe can Beans do it better.
What do you think about that? Jochen
Hey Jochen,
Beans tend to follow WordPress standards to the letter and here we just kept the default widget title markup. As usual, it is really easy to modify it according to your project. For example, if you wanted to modify all your widget heading to an h4, all you have to add to your child theme functions.php is the following:
beans_modify_markup( 'beans_widget_title', 'h4' );Indeed you can also target all the widgets in a specific widget area or even change it on a per widget basis. h4 is just an example but you may change it to whatever markup floats your boat 🙂
Happy coding,
It might just be me, but it would be a good idea to keep track of these things. Maybe under Snippets? Automattic may keep WP on a strict roadmap, but it is interesting to observe that for VIP services they do engage in seo optimisations exactly like this one. It's been equally interesting to note that there's been a lot of effort to keep structured data foundations out of the main track. Anyhow, those are seperate and often sensitive debates.
One of the core strengths of Beans is that it provides a very healthy and extensible structured data foundation integral to its framework. It would be a shame not to reinforce this, because it is a wide arena full of black holes these days.
Widget titles is one thing, another good example is the distinction between webpage (post) and article types (page).
There is a seperate branch for WP Compliancy, no? Is that intended as a baseline, or a specialisation?
J.C. I agree to disagree on this one. In a lot of cases, h3 is an appropriate tag for widget titles. It really depends on the website and there is no general rule which would apply to all projects.
In such cases, Beans keeps it WP standard to make sure it is compliant with all other well built themes/plugins when switching to Beans. As I mentioned in my previous reply and as you correctly said, Beans provide a very healthy way of setting up your HTML according to your needs. For each projects, you should have a setup function/file where you add lines of code (like give in my previous reply) to setup your website HTML.
Regarding the wp-directory-compliancy branch, not isn't a separate version of Beans. I am working hard on trying to get Beans on wordpress.org which would be a massive achievement considering the nature of Beans and the strict limitations they have (pretty much only accepts very simple and very limiting themes).
Cheers,
Hello, I didn't finde a data-markup-id for the reply-title H3.
How can I change the h3 to a div?
<h3 id="reply-title" class="comment-reply-title">
Add a Comment
...
</h3>thanks Jochen
Hi Jochen,
Beans uses WP Core functions when possible to make it as "plugin friendly" as possible. In this case the reply title markup is generated by WordPress Core comment_form() function. That said WP has a filter for the default arguments and you could change it to an h4 (for example) using the following snippet:
add_filter( 'comment_form_defaults', 'example_comment_form_defaults' );
function example_comment_form_defaults( $args ) {
return array_merge( $args, array(
'title_reply_before' => '<h4 id="reply-title" class="comment-reply-title">',
'title_reply_after' => '</h4>',
) );
}Unfortunately, these kind of filters needs some research and are not as intuitive as Beans HTML API 🙁
Happy coding,
Thank you for your support!
I use that now in my Beans themes to replace the h2 and h3
// Replace h2 and h3 with div
beans_modify_markup( 'beans_widget_title', 'div' );
beans_add_attribute( 'beans_widget_title', 'class', 'uk-text-large' );
beans_modify_markup( 'beans_comments_title', 'div' );
beans_add_attribute( 'beans_comments_title', 'class', 'uk-text-large' );
add_filter( 'comment_form_defaults', 'example_comment_form_defaults' );
function example_comment_form_defaults( $args ) {
return array_merge( $args, array(
'title_reply_before' => '<div id="reply-title" class="comment-reply-title uk-text-large">',
'title_reply_after' => '</div>',
) );
}Great stuff!
I see you are using uk-text-large for the title replaced with a div. Just for info, there are title class you can use such as uk-h1, uk-h2, uk-h3, uk-h4, uk-h5, uk-h6 if you want to apply a title style to a none title markup 🙂
Have fun,
oh, very handy 🙂
I found another SEO problem at beans.
There is no title on the archiv pages like cat, tag, archives. Its important to have a h1 on every page.
But that is a wordpress standard. See: https://twentysixteendemo.wordpress.com/tag/announcement/
Thiery, what do you think about that?
Hey Jochen,
Thanks for reporting it. I just added the archive title in this commit on Beans development repo so you can pull from there, it will automatically be in the next Beans release.
Beans is very pedentic about changes which might affect current websites in any ways when updating to a newer version. While this might seem like a minor change, it will indeed be flagged as important in the changelog so that users are aware that something will be added to their website which might not be intended.
Thanks again for reporting this 🙂