wpautop和一个特定的标签

时间:2015-11-15 13:31:14

标签: html css wordpress flexbox

我需要有一个自定义标签,我不会被p块包围,但我不想完全关闭它。 Here is my code我正在尝试添加:

HTML:

<hnav>
    <ul>
        <li><a href="home.html">Breakfast</a></li>
        <li><a href="about.html">Same Day - Hot</a></li>
        <li><a href="services.html">Same Day - Room Temp</a></li>
        <li><a href="products.html">Entrees - Hot</a></li>
        <li><a href="jobs.html">Entrees - Room Temp</a></li>
        <li><a href="contact.html">Vegetarian - Hot</a></li>
        <li><a href="contact.html">Vegetarian - Room Temp</a></li>
        <li><a href="contact.html">Soups</a></li>
        <li><a href="contact.html">Salads</a></li>
        <li><a href="contact.html">Sandwiches</a></li>
        <li><a href="contact.html">Receptions</a></li>
        <li><a href="contact.html">Hoar Dourves</a></li>
        <li><a href="contact.html">Desserts</a></li>
        <li><a href="contact.html">Drinks</a></li>
        <li id="x" class="x"><a href="privacy.html">Privacy</a></li>
    </ul>
</hnav>

CSS:

hnav {
    background: #f0f0f0;
    border: 1px solid #ccc;
    border-right: none;
    width: 100%;
    margin-bottom: 20px;
}

hnav ul {
    margin: 0;
    padding: 0;
}

hnav ul li {
    list-style: none;
    text-align: center;
    border-left: 1px solid #fff;
    border-right: 1px solid #ccc;
}

hnav ul li:first-child {
    border-left: none;
}

hnav ul li a {
    display: block;
    text-decoration: none;
    color: #616161;
    padding: 10px 0;
}

hnav {
    display: table;
    table-layout: fixed;
}

hnav ul {
    display: flex;
    flex-direction: row;
}

hnav ul li {
    flex-grow: 1;
}

@media (max-width: 430px) {
    hnav ul {
        display: block;
    }

    hnav {
        font-size: .8em;
    }
    hnav ul li {
        display: block;
        border-bottom: 1px solid #ccc;
    }
}

无论我做什么,hnav都会被p包围。

1 个答案:

答案 0 :(得分:0)

我最近遇到过这个问题,发现this很有用。我会将代码移植到一个短代码中,并使用它来删除默认生成的段落标记。

add_shortcode("hnav", function($atts, $content)
{
    return "<hnav>$content</hnav>";
});

// https://wordpress.org/plugins/shortcode-empty-paragraph-fix/
add_filter("the_content", function($content)
{
    //define your shortcodes to filter, '' filters all shortcodes
    $shortcodes = array('hnav');

    foreach ( $shortcodes as $shortcode ) {

        $array = array (
            '<p>[' . $shortcode => '[' .$shortcode,
            '<p>[/' . $shortcode => '[/' .$shortcode,
            $shortcode . ']</p>' => $shortcode . ']',
            $shortcode . ']<br />' => $shortcode . ']'
        );

        $content = strtr( $content, $array );
    }

    return $content;    
});