WordPress - 显示特定的小部件

发布于 2024-10-03 03:22:43 字数 726 浏览 0 评论 0原文

我有点迷失了。

假设我有一个动态页脚侧边栏。到目前为止很容易。

<footer>
    <?php get_sidebar("name") ?>  
</footer>

将其显示在页脚中。

但我们到了。我希望每个小部件都在我的网格内:

      <footer>
         <div style="width: 100px:">
            <div style="width: 25%">First widget here</div>
            <div style="width: 25%">Second widget here<</div>
            <div style="width: 25%">Third widget here<</div>
            <div style="width: 25%">Fourth widget here<</div>
          </div>
        </footer>

所以 get_sidebar 现在不是一个选项,因为它连续显示所有小部件。而且我不想编辑小部件本身。

他们如何在主题中做到这一点?

谢谢。

I'm lost a bit.

Let's say I have a dynmic footer-siderbar. Easy so far.

<footer>
    <?php get_sidebar("name") ?>  
</footer>

Displys it in the footer.

But here we are. I want EACH widget inside of my grid:

      <footer>
         <div style="width: 100px:">
            <div style="width: 25%">First widget here</div>
            <div style="width: 25%">Second widget here<</div>
            <div style="width: 25%">Third widget here<</div>
            <div style="width: 25%">Fourth widget here<</div>
          </div>
        </footer>

So get_sidebar isn't an option now, since it displays all widgets in a row. And I don't want to edit widgets itself.

How they do that in themes?

Thanks.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

寄居者 2024-10-10 03:22:43

您可以使用“the_widget”函数来实现此目的:

<?php the_widget($widget, $instance, $args); ?>

更多信息可以在 Wordpress Codex - The_Widget 参考。

You can use the 'the_widget' function for this:

<?php the_widget($widget, $instance, $args); ?>

More information can be found on the Wordpress Codex - The_Widget reference.

倾城月光淡如水﹏ 2024-10-10 03:22:43

或者,您也可以使用:

<?php dynamic_sidebar( 'sidebar-1' ); ?>   

Alternatively you can also use :

<?php dynamic_sidebar( 'sidebar-1' ); ?>   
離人涙 2024-10-10 03:22:43

这也是一个很好的参考 - 函数参考/动态侧边栏 « WordPress Codex

如果您使用该方法在该页面上:

<ul id="sidebar">
 <?php if ( !dynamic_sidebar() ) : ?>
    <li>{static sidebar item 1}</li>
    <li>{static sidebar item 2}</li>
 <?php endif; ?>
 </ul>

然后,您可以使用 CSS 样式将侧边栏小部件放置在页脚上。

编辑以包含以下内容...

Arras 主题 CSS:

#footer             { margin: 20px auto 0; width: 980px; background: #ECEBE6; padding-bottom: 10px; border: 1px solid #CCC; }
#footer .widgetcontainer    { padding: 5px 10px; min-width: 150px; }
.no-js #footer .widgetcontainer { height: 190px; }
#footer .widgettitle    { background: none; border: none; font-size: 14px; color: #444; padding: 0 0 10px; letter-spacing: -1px; }
#footer .widgetcontent  { font-size: 12px; background: none; padding: 0; border: none; }
#footer .footer-message { margin: 0; padding: 10px 15px 0; font-size: 11px; }
#footer .footer-message p { margin: 0 0 0.5em; }
#footer .footer-message .floatright { margin-left: 20px; }
#footer-sidebar     { overflow: hidden; margin: 10px 10px 0; padding: 0 0 10px; border-bottom: 1px solid #CCC; }
#footer-sidebar .widgetcontainer    { float: left; margin: 0; max-width: 250px; }
#footer-sidebar ul  { list-style: none; margin: 0; padding: 0; }
#footer-sidebar li  { margin: 0 0 3px; }

页脚编码:

<ul id="footer-sidebar" class="clearfix xoxo">
        <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Footer') ) : ?>
        <li></li>
    <?php endif; ?>
</ul>

然后在主题中将小部件放置在整个页面上。

This is a good reference as well - Function Reference/dynamic sidebar « WordPress Codex

If you use the method on that page:

<ul id="sidebar">
 <?php if ( !dynamic_sidebar() ) : ?>
    <li>{static sidebar item 1}</li>
    <li>{static sidebar item 2}</li>
 <?php endif; ?>
 </ul>

You could then use CSS styling to position the sidebar widgets across the footer.

Edit to include the following...

Arras theme CSS:

#footer             { margin: 20px auto 0; width: 980px; background: #ECEBE6; padding-bottom: 10px; border: 1px solid #CCC; }
#footer .widgetcontainer    { padding: 5px 10px; min-width: 150px; }
.no-js #footer .widgetcontainer { height: 190px; }
#footer .widgettitle    { background: none; border: none; font-size: 14px; color: #444; padding: 0 0 10px; letter-spacing: -1px; }
#footer .widgetcontent  { font-size: 12px; background: none; padding: 0; border: none; }
#footer .footer-message { margin: 0; padding: 10px 15px 0; font-size: 11px; }
#footer .footer-message p { margin: 0 0 0.5em; }
#footer .footer-message .floatright { margin-left: 20px; }
#footer-sidebar     { overflow: hidden; margin: 10px 10px 0; padding: 0 0 10px; border-bottom: 1px solid #CCC; }
#footer-sidebar .widgetcontainer    { float: left; margin: 0; max-width: 250px; }
#footer-sidebar ul  { list-style: none; margin: 0; padding: 0; }
#footer-sidebar li  { margin: 0 0 3px; }

Footer coding:

<ul id="footer-sidebar" class="clearfix xoxo">
        <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Footer') ) : ?>
        <li></li>
    <?php endif; ?>
</ul>

In the theme it then places the widgets across the page.

忱杏 2024-10-10 03:22:43

请查看我的新插件,它显示特定的小部件。

访问:
http://wordpress.org/extend/plugins/widget-instance/

Please checkout my new plugin that displays a specific widget.

Visit:
http://wordpress.org/extend/plugins/widget-instance/

蛮可爱 2024-10-10 03:22:43

您可以使用小部件选项插件来限制或控制小部件在任何页面和设备上的可见性;在存储库上免费提供:https://wordpress.org/plugins/widget-options/。或者尝试使用 widget_display_callback https://developer.wordpress.org/参考/hooks/widget_display_callback/ 。我希望这有帮助。

function custom_display_callback( $instance, $widget, $args ){
    if( is_page() ){
        return false;
    }
    return $instance;
}
add_filter( 'widget_display_callback', 'custom_display_callback', 50, 3 );

输入图片此处描述

You can use Widget Options Plugin to restrict or control the widgets visibility on any pages and devices; available for free on the repository : https://wordpress.org/plugins/widget-options/. Or try using widget_display_callback https://developer.wordpress.org/reference/hooks/widget_display_callback/ . I hope this helps.

function custom_display_callback( $instance, $widget, $args ){
    if( is_page() ){
        return false;
    }
    return $instance;
}
add_filter( 'widget_display_callback', 'custom_display_callback', 50, 3 );

enter image description here

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文