I'm working the first time with WordPress, now I'm trying to add a custom Widget to an HTML box.
The HTML: The blank News box
I started to read a bit about widgets and the tutorials told me to create a new Widget area inside my functions.php document, which i did with the following code:
<?php
/**
* Register our sidebars and widgetized areas.
*
*/
function arphabet_widgets_init() {
register_sidebar( array(
'name' => 'Home right sidebar',
'id' => 'home_right_1',
'before_widget' => '<div>',
'after_widget' => '</div>',
'before_title' => '<h2 class="rounded">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'arphabet_widgets_init' );
?>
Now i went into my index.php document, which stores the HTML so I tried to add the following code to the HTML blank news box:
<?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
<div id="primary-sidebar" class="primary-sidebar widget-area" role="complementary">
<?php dynamic_sidebar( 'sidebar-1' ); ?>
</div><!-- #primary-sidebar -->
<?php endif; ?>
After i finished this also, i went into my WordPress admin menu and applied the plugin to the widget.
But it wouldn't show up...
Does anyone have a idea why?
update your index.php code as below:
<?php if ( is_active_sidebar( 'home_right_1' ) ) : ?>
<div id="primary-sidebar" class="primary-sidebar widget-area" role="complementary">
<?php dynamic_sidebar( 'home_right_1' ); ?>
</div><!-- #primary-sidebar -->
<?php endif; ?>
Related
I've created a custom widget area in the plugin I'm creating.
function arphabet_widgets_init() {
register_sidebar( array(
'name' => 'Home right sidebar',
'id' => 'home_right_1',
'before_widget' => '<div>',
'after_widget' => '</div>',
'before_title' => '<h2 class="rounded">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'arphabet_widgets_init' );
dynamic_sidebar( 'home_right_1' );
And to enable showing the widgets stored in this widget I have inserted this code inside the footer.php of the theme I'm currently using for testing.
<?php if ( is_active_sidebar( 'home_right_1' ) ) : ?>
<div id="primary-sidebar" class="primary-sidebar widget-
area" role="complementary">
<?php dynamic_sidebar( 'home_right_1' ); ?>
</div><!-- #primary-sidebar -->
<?php endif; ?>
It works, when I add widgets to my widget area, they are shown in footer of the website. But I want to make the plugin works without changing the footer.php manually. How can I check which theme is activated and then find that theme, the footer.php file and add that code exacltly where I want (to be shown below any other footer created with the theme when is installed. Also, I would like to remove the footer that was generated before.
I have a calendar plugin I wish to use, I tested it first on the WP '17 default theme and it displays just fine. I have my own custom theme I'm building using w3.css, very basic stuff.
I created a display area for widgets using
<?php
/**
* Register our sidebars and widgetized areas.
*
*/
function arphabet_widgets_init() {
register_sidebar( array(
'name' => 'Home right sidebar',
'id' => 'home_right_1',
'before_widget' => '<section id="%1$s" class="widget %2$s">',
'after_widget' => '</section>',
'before_title' => '<h2 class="widget-title">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'arphabet_widgets_init' );
add_theme_support( 'customize-selective-refresh-widgets' );
wp_enqueue_script("jquery");
?>
And put the following in an appropriate div within my index.php:
<?php dynamic_sidebar( 'home_right_1' ); ?>
As far as I can tell, when my "theme" outputs the widget there is no stylesheet attached to it. It's a calendar widget and displays the entire list of days of the month in a long list, rather than an enclosed area.
Any suggestions would be appreciated.
Okay, I hadn't called the footer which is apparently where the function hooks to. Now it's working as expected.
<?php get_footer(); ?>
(Placed just before </body> in the index file.)
I also ended up using the following to call it:
<?php if ( is_active_sidebar( 'home_right_1' ) ) : ?>
<div id="primary-sidebar" class="primary-sidebar widget-area" role="complementary">
<?php dynamic_sidebar( 'home_right_1' ); ?>
</div><!-- #primary-sidebar -->
<?php endif; ?>
I followed the instructions here for how to add a widget to a template. I added this code to functions.php:
function arphabet_widgets_init() {
register_sidebar( array(
'name' => 'Carousel',
'id' => 'carousel_widget',
'before_widget' => '<div>',
'after_widget' => '</div>',
'before_title' => '<h2 class="rounded">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'arphabet_widgets_init' );
and I added this to my custom template:
<?php if ( is_active_sidebar( 'carousel_widget' ) ) : ?>
<div id="carousel-widget" class="carousel widget-area">
<?php dynamic_sidebar( 'carousel_widget' ); ?>
</div>
<?php endif; ?>
It worked, but my new widget showed up as a sidebar, and I want it to be in the main body of the page. Obviously this is because of the dynamic_sidebar function, but the documentation is not very helpful on how to place a widget on the page NOT as a sidebar.
I tried replaced the php with this:
<div id="carousel-widget" class="carousel widget-area">
<?php the_widget( 'carousel_widget' ); ?>
</div>
But now it doesn't show up at all.
How do I place this widget on my page without it showing up as an absolutely positioned sidebar?
My dynamic sidebar does not show standard widgets like recent posts or archives but the individual content I put into the sidebar.php
This is the sidebar-part from my functions.php:
add_action( 'widgets_init', 'my_register_sidebars' );
function my_register_sidebars() {
register_sidebar( array(
'name' => __( 'Primäre Sidebar' ),
'id' => 'sidebar-main',
'description' => __( 'Rechte Hauptsidebar für Werbeflächen und Meta' ),
'before_title' => '<h4>',
'after_title' => '</h4>',
) );
and this is the code from sidebar.php:
<aside id="sidebar-main">
<div id="widgetarea">
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : endif; ?>
<h4>TESTESTEST</h4>
<p>HALLOHALLO</p>
</div>
</aside>
As always, I call the sidebar by <?php get_sidebar(); ?> in my theme.
How come the other stuff is being displayed but not the widgets? I have no clue.
Edit: I already tried deactivating plugins - no change.
Your call to your sidebar is wrong. This
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : endif; ?>
should be
<?php if ( is_active_sidebar( 'sidebar-main' ) ) : ?>
<?php dynamic_sidebar( 'sidebar-main' ); ?>
<?php endif; ?>
try this in sidebar.php:
<aside id="sidebar-main">
<div id="widgetarea">
<?php dynamic_sidebar('Primäre Sidebar') ?>
</div>
</aside>
I am creating new Wordpress theme. It's working but not showing widgets bar in admin panel.
Here is my code:
<?php get_header(); ?>
<div class="wrapper">
<!--Navigation start-->
<div class="navigation_content">
<nav>
<ul>
<?php $args = array(
'depth' => 0,
'sort_column' => 'menu_order, post_title',
'menu_class' => 'menu',
'include' => '',
'exclude' => '',
'echo' => true,
'show_home' => true,
'link_before' => '',
'link_after' => '' );
?>
<li class=""><?php wp_page_menu( $args ); ?></li>
</ul>
</nav>
</div>
<!--Navigation start-->
<!-- body content start-->
<div class="body_content">
<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<!--end post header-->
<div class="entry clear">
<?php if ( function_exists( 'add_theme_support' ) ) the_post_thumbnail(); ?>
<p><?php the_content(); ?></p>
<?php //edit_post_link(); ?>
<?php wp_link_pages(); ?>
</div><!--end entry-->
</div><!--end post-->
<?php endwhile; /* rewind or continue if all posts have been fetched */ ?>
<?php else : ?>
<?php endif; ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
And here is my function file code to register widgets:
function ccp_widgets_init() {
register_sidebar( array(
'name' => __( 'Main Widget Area', 'ccp' ),
'id' => 'sidebar-1',
'description' => __( 'Appears in the footer section of the site.', 'ccp' ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
) );
Am i missing code?
Thanks
Add the following code in functions.php after your ccp_widgets_init function.
add_action( 'widgets_init', 'ccp_widgets_init' );
There is another way.
Definitely use a child theme
In your child-theme folder:
Create a folder called widgets
Put your widget in there
ie.
wp-content/themes/my-child-theme/widgets/my_widget.php
at the end of your widget there is no need to 'hook' it into any action like this as most posts say
function register__my_widget() {
register_widget( 'my_widget_class_name_exends_WP_Widget_class' );
}
add_action( 'widgets_init', 'register__my_widget' );
So just register it as normal at the end with a single line:-
register_widget( 'my_widget_class_name_exends_WP_Widget_class' ) see below:
<?php function get_recent_post( $beforewidget, $afterwidget, $beforetitle, $aftertitle ){ ?>
<?php echo $beforewidget; ?>
<?php echo $beforetitle; ?>Recent Posts<?php echo $aftertitle; ?>
<ul class="rp-widget">
<?php query_posts( array ( 'category_name' => 'blog', 'posts_per_page' => -1 ) );
while ( have_posts() ) : the_post(); ?>
<li>....
....very boring widget code, yawn...
...instance ) {
// outputs the content of the widget
get_recent_post( $args['before_widget'], $args['after_widget'], $args['before_title'], $args['after_title'] );
}
}
register_widget( 'my_widget_class_name_exends_WP_Widget_class' );
The important bit is the last line - the "register_widget" bit.
Nb. all widgets extend WP_widget class (I think it's a class - would be in java/c++) so you register your class name
3.Then in your child-themes's functions.php add this line
get_template_part('widgets/my_widget');
and you should be groovy!
Nb:
The line added to your child-theme functions.php should be added outside of any function
The path should exist ie. widgets/
It should be the name of your file MINUS the .php part
(It is not essential to use a separate folder but it helps keep code organised and so if you have added a widgets folder in your child theme and put my_widget.php in there then point is valid.
IF you didn't add a widgets folder to your child-theme folder then you would just use
get_template_part('my_widget');
in your child functions.php
)
What's the advantage of doing it this way??
You can separate your code to be more modular
You don't end up having a monster sized functions.php file
It should be easier to maintain or modify