0

In WordPress page, the <main> tags are wrapped by <p>s, but <div>s are not.

WordPress 4.7.12

Example 1: Using main tag

<main>
<div>this is main</div>
</main>

results

<p><main></p>
<div>this is main</div>
<p></main></p>

Example 2: Using div#main

<div id="main">
<div>this is main</div>
</div>

results

<div id="main">
<div>this is main</div>
</div>

Question

What is the trigger to wrap with <p>?

Remarks

My page.php is below.

<?php
/**
 * @package WordPress
 * @subpackage Default_Theme
 */

get_header(); ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php remove_filter('the_content', 'wpautop'); ?>
<?php the_content('<p class="serif">' . __('Read the rest of this page &raquo;', 'kubrick') . '</p>'); ?>
<?php add_filter('the_content', 'wpautop'); ?>
<?php endwhile; endif; ?>


<?php get_footer(); ?>
noobar
  • 803
  • 10
  • 15

2 Answers2

0

<div> element is used to design to describe a container of data.

<p> element is designed to describe a paragraph of content.

<main> element represents the dominant content of the <body> of a document. The main content area consists of content that is directly related to or expands upon the central topic of a document, or the central functionality of an application.

Note: As we know <div> tag represents container and <p> tag represents paragraph of content so the can not lie in

tag.

More details

Gufran Hasan
  • 8,910
  • 7
  • 38
  • 51
0

It's defined in wp-includes/formatting.php#wpautop as disribed in this post.

I edited my formatting.php using the code in the post and the <p> is eliminated.

  1. Open wp-includes/formatting.php
  2. Find function wpautop in it.
  3. Copy the function.
  4. Open [your theme folder]/functions.php.
  5. Paste 3 and rename wpautop to wpautop_fork.
  6. Find the line defining $allblocks = '(?:table|thead|tfoot|caption|col|....
  7. Add main (see the code below.)
  8. Register wpautop_folk instead of wpautop.

My function.php becomes following code.

function wpautop_forked( $pee, $br = true ) {
    //...
    // Add 'main' at the tail.
    $allblocks = '(?:table|thead|tfoot|caption|col|colgroup|tbody|tr|td|th|div|dl|dd|dt|ul|ol|li|pre|form|map|area|blockquote|address|math|style|p|h[1-6]|hr|fieldset|legend|section|article|aside|hgroup|header|footer|nav|figure|figcaption|details|menu|summary|main)'
    //...
}
remove_filter('the_content', 'wpautop');
add_filter('the_content', 'wpautop_forked');

This Q&A is also helpful:

Stop Wordpress Wrapping Images In A ā€œPā€ Tag

noobar
  • 803
  • 10
  • 15