Jump to content

Sidebar widget on the left from a post


Recommended Posts

Hi all,

I have a sidebar which is now to the right from the articles on posts/pages (incorporated in the theme). Now I would like to add a widget sidebar that would be to the left from an article (of a post/page).

To register a sidebar, I would use this code:

function wpb_widgets_init() {

	register_sidebar( array(
		'name' => __( 'Main Sidebar', 'wpb' ),
		'id' => 'sidebar-1',
		'description' => __( 'The main sidebar appears on the right on each page except the front page template', 'wpb' ),
		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
		'after_widget' => '</aside>',
		'before_title' => '<h3 class="widget-title">',
		'after_title' => '</h3>',
	) );

	register_sidebar( array(
		'name' =>__( 'Front page sidebar', 'wpb'),
		'id' => 'sidebar-2',
		'description' => __( 'Appears on the static front page template', 'wpb' ),
		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
		'after_widget' => '</aside>',
		'before_title' => '<h3 class="widget-title">',
		'after_title' => '</h3>',
	) );
	}

add_action( 'widgets_init', 'wpb_widgets_init' );

Then to position it to the left from an article, the CSS class should be like this?:

.sidebar {
		float: left;
		margin-right: -100%;
		max-width: 413px;
		position: relative;
		width: 29.4118%;
	}

Thank you in advance for your help.

 

Milada

 

Link to post
Share on other sites

It really depends on what order the resulting elements are in the HTML and what styles have been applied to the other elements.

I would not set the margin to -100%.

Link to post
Share on other sites

The layout is determined by the specific template page you use for a single post, category posts, page or archive pages, usually you would have left and right sidebar code to show when required by setting in the sidebar array the id of post or page you wish the sidebar to appear.

Link to post
Share on other sites

I have created this code:

genesis_register_sidebar( array(

    'id'        => 'alonside-posts-sidebar',

    'name'      => __('Alonside Posts', 'wellness' ),

    'description'   => __('This is a sidebar that goes alongside the posts in the #content.' ),

) );

add_action( 'genesis_before_loop', 'wellness_alongside_posts_sidebar' );

/** Loads a new sidebar alongside the posts in the #content */

function wellness_alongside_posts_sidebar() {

 

    echo '<div class="alongside-posts-sidebar">';

        dynamic_sidebar( 'alongside-posts-sidebar' );

    echo '</div>';

 }

 

Can you please tell me if it´s correct? I would like to have a sidebar alongside the content on the left? What should be added?

Thank you,

 

Milada

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...