I just learned how to create a custom WordPress theme. I would like to assign a class to my sidebar for styling, but I have not found anything online that explains how to do this. The code I added to my functions.php file to register my sidebar is:
if ( function_exists('register_sidebar') )
register_sidebar(array(
'id' => 'sidebar-1',
'description' => __( 'Add widgets here to appear in your sidebar.', 'twentysixteen' ),
'before_widget' => '',
'after_widget' => '',
'before_title' => '',
'after_title' => '',
));
And the code I added to my sidebar.php file is:
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>
<?php endif; ?>
Any help would be greatly appreciated!
Use before_widget and after_widget to add a wrapper.
register_sidebar( array(
'name' => esc_html__( 'Sidebar', 'twentysixteen' ),
'id' => 'sidebar-1',
'description' => 'Add widgets here to appear in your sidebar.',
'before_widget' => '<aside id="%1$s" class="widget custom-class %2$s">',
'after_widget' => '</aside>',
'before_title' => '<h2 class="widget-title custom-class">',
'after_title' => '</h2>',
) );
Try this in functions.php file
Related
i'm programming a plugin in php for wordpress for managing widgets, their places in a page and in which page they should appear. I'm having problems because i can't activate my sidebar and i dont know why. I post my code to see if something is not right and you can help me. this first file is the functions.php that, in theory, should register sidebars.
require_once('widgets.php');
function my_register_sidebars(){
// Register the 'primary' sidebar.
register_sidebar(
array(
'id' => 'primary',
'name' => __('Primary Sidebar'),
'description' => __('A short description of the sidebar.'),
'before_widget' => '<div id="%1$s" class="widget %2$s">',
'after_widget' => '</div>',
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
)
);
register_sidebar(
array(
'id' => 'adios',
'name' => __('adios'),
'description' => __('A short description of the sidebar.'),
'before_widget' => '<div id="%1$s" class="widget %2$s">',
'after_widget' => '</div>',
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
)
);
}
add_action('widgets_init', 'my_register_sidebars');
after a series of try-outs, I have also seen that add_action is not doing his work, do you have answers about it?
After that i instantiated a new file(sidebar.php) to recall the sidebar.
<?php
if (is_active_sidebar('primary')) : ?>
<aside id="secondary" class="sidebar widget-area" role="complementary" style="background-color = 'black';">
<?php dynamic_sidebar('primary'); ?>
</aside><!-- .sidebar .widget-area -->
<?php endif; ?>
And finally to call the sidebar i use get_sidebar();
but i cannot show the sidebar and it seems it is not even active.
do you have also ideas on how i can add widgets to this "activated" sidebar?
Thank you for your helps.
Use this code in your function.php
function my_custom_sidebar() {
register_sidebar(
array (
'name' => __( 'Custom', 'your-theme-domain' ),
'id' => 'custom-side-bar',
'description' => __( 'Custom Sidebar', 'your-theme-domain' ),
'before_widget' => '<div class="widget-content">',
'after_widget' => "</div>",
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
)
);} add_action( 'widgets_init', 'my_custom_sidebar' );
And put this code to your template file
<?php if ( is_active_sidebar( 'custom-side-bar' ) ) : ?>
<?php dynamic_sidebar( 'custom-side-bar' ); ?>
Try This code
I have a html template and I have this code in my html and wants to convert this in wordpress
<div id="home">
<!-- Home Page -->
<p class="blue">NEED A DESIGNER?</p>
<p class="orange">I AM HERE</p>
<span><i class="fa fa-phone-square"></i> +1 234 567 876 54</span>
<!-- / Home Page -->
</div>
I want to call this as dynamic_sidebar(); ....
how i can register sidebar in functions.php file...
I tried as following
add_action( 'widgets_init', 'homepage_widget' );
function homepage_widget() {
register_sidebar( array(
'name' => __( 'main homepage', 'theme-slug' ),
'id' => 'homepagelol',
'description' => __( 'Widgets in this area will be shown on all posts and pages.', 'theme-slug' ),
'class' => 'orange',
'before_widget' => '<div id="home">',
'after_widget' => '</div>',
'before_title' => '<p class="blue">',
'after_title' => '</div>',
) );
}
There are few steps you need to follow:
Step 1 : Register your sidebar
add_action( 'widgets_init', 'theme_slug_widgets_init' );
function theme_slug_widgets_init() {
register_sidebar( array(
'name' => __( 'Main Sidebar', 'theme-slug' ),
'id' => 'sidebar-1',
'description' => __( 'Widgets in this area will be shown on all posts and pages.', 'theme-slug' ),
'before_widget' => '<li id="%1$s" class="widget %2$s">',
'after_widget' => '</li>',
'before_title' => '<h2 class="widgettitle">',
'after_title' => '</h2>',
) );
}
Step 2: In widget Area, you see your sidebar, then add text widget and put your html in text widget
Step 3: Then call your sidebar in index.php
<?php dynamic_sidebar('your-sidebar-unique-id'); ?>
Then save your page and reload..
Hope this will help you.
thanks
You can try this code to register sidebar, hope it helps.
if ( function_exists('register_sidebar') )
register_sidebar(array('name'=>'MiddleSidebar',
'before_widget' => '<li class="widget">',
'after_widget' => '</li>',
'before_title' => '<h2 class="widgettitle">',
'after_title' => '</h3>',
));
register_sidebar(array('name'=>'FooterSidebar',
'before_widget' => '<li class="widget">',
'after_widget' => '</li>',
'before_title' => '<h2 class="widgettitle">',
'after_title' => '</h3>',
));
I`m wondering, how to add function nl2br to my sidebar at WordPress.
Thing is, I add text widget to my sidebar and I want to change 'enter' to .
I know, that to register sidebar is code:
register_sidebar( array(
'name' => __( 'Footer First', 'myTheme' ),
'id' => 'sidebar-5',
'description' => __( 'Footer widget appears everywhere', 'myTheme' ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
) );
I was trying to add nl2br to before_widget, but it dont works... Probybly I need add function to my functions.php but I have no idea how to get content of my text widget.
How to create a widget area in wordpress pages section. if I add below code in my functions.php file the widget created in dashboard menu section I want to add additional widget in my pages section not in dashboard.
Add a widget to the dashboard.
//This function is hooked into the 'wp_dashboard_setup' action below.
function example_add_dashboard_widgets() {
wp_add_dashboard_widget(
'example_dashboard_widget', // Widget slug.
'Example Dashboard Widget', // Title.
'example_dashboard_widget_function' // Display function.
);
}
add_action( 'wp_dashboard_setup', 'example_add_dashboard_widgets' );
Create the function to output the contents of our Dashboard Widget.
function example_dashboard_widget_function() {
// Display whatever it is you want to show.
echo "Hello World, I'm a great Dashboard Widget";
}
you should register sidebar in functions.php as
if (function_exists('register_sidebar')) {
register_sidebar(array(
'name' => 'widget_name',
'id' => 'widget-id',
'description' => 'Type something here',
'before_widget' => '<div id="one" class="two">',
'after_widget' => '</div>',
'before_title' => '<h2>',
'after_title' => '</h2>'
));
}
it will register sidebar(widget) in your dashboard. Now you can you is it anywhere by
<?php dynamic_sidebar('widget-id'); ?>
This function already exists in default theme
function twentyfourteen_widgets_init() {
require get_template_directory() . '/inc/widgets.php';
register_widget( 'Twenty_Fourteen_Ephemera_Widget' );
register_sidebar( array(
'name' => __( 'Primary Sidebar', 'twentyfourteen' ),
'id' => 'sidebar-1',
'description' => __( 'Main sidebar that appears on the left.', 'twentyfourteen' ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
'before_title' => '<h1 class="widget-title">',
'after_title' => '</h1>',
) );
register_sidebar( array(
'name' => __( 'Content Sidebar', 'twentyfourteen' ),
'id' => 'sidebar-2',
'description' => __( 'Additional sidebar that appears on the right.', 'twentyfourteen' ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
'before_title' => '<h1 class="widget-title">',
'after_title' => '</h1>',
) );
register_sidebar( array(
'name' => __( 'Footer Widget Area', 'twentyfourteen' ),
'id' => 'sidebar-3',
'description' => __( 'Appears in the footer section of the site.', 'twentyfourteen' ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
'before_title' => '<h1 class="widget-title">',
'after_title' => '</h1>',
) );
}
add_action( 'widgets_init', 'twentyfourteen_widgets_init' );
you can create multiple widget area by copy and pasting this and chage the id every time
register_sidebar( array(
'name' => __( 'new area', 'twentyfourteen' ),
'id' => 'sidebar-5',
'description' => __( 'Appears in the footer section of the site.', 'twentyfourteen' ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
'before_title' => '<h1 class="widget-title">',
'after_title' => '</h1>',
) );
}
In function.php add:
function create_widget($name, $id, $description) {
register_sidebar(array(
'name' => __( $name ),
'id' => $id,
'description' => __( $description ),
'before_widget' => '<div id="'.$id.'" class="widget %1$s %2$s">',
'after_widget' => '</div>',
'before_title' => '<h3>',
'after_title' => '</h3>'
));
}
create_widget("Header", "uptop", "Displays in the header of the site, above the title"); // Create the actual widgets
Then add next code in place u wanna use this area, for example in your header.php:
<?php if ( !dynamic_sidebar('uptop') ); ?>
Is there a way to have individual title widget to have a link of their own without using a plugin?
register_sidebar( array(
'name' => __( 'Footer', 'classic' ),
'id' => 'sidebar-3',
'description' => __( 'An optional widget area for your site footer', 'classic' ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => "</aside>",
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
) );
There is no other way than to use a plugin but I refuse to do so. So I have used jQuery to trigger the widget title with specific id and added a link.
$("#menu1 h3").wrap('');