Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Montezuma Theme (http://forum.bytesforall.com/forumdisplay.php?f=53)
-   -   How to add left sidebar widget area (http://forum.bytesforall.com/showthread.php?t=19249)

corynicastro Jan 3, 2013 01:40 PM

How to add left sidebar widget area
 
Hello.

I have searched through these forums looking for an answer to my question, but I am simply not following what's being said/cannot find what has been recommended--at this point, I feel like a complete idiot and very frustrated.

I would like to add a widget area to the left sidebar. I am using Montezuma theme. I have a very limited understanding of technical jargon. A question that seemed similar to mine suggested I search for "widgets" in the "limited PHP code" dropdown box but that was fruitless. I attempted to add something from the dynamic widget area into the CSS file but...I have no idea how to do any of this. I like the Montezuma theme more than any other I've found since using Wordpress but I am beginning to worry that maybe my skill level is just too low to use it. Please help! My blog is www.corynicastro.com

Michael4fm Jan 3, 2013 02:08 PM

Where / how are you getting the left sidebar? As I understand it, it's as simple as adding one line of code in whichever template file you want it in - post, page, index etc. Code is ...

HTML Code:

<?php dynamic_sidebar( 'Widget Area INDEX' ); ?>
... where "INDEX" is whatever name you want to call your widget area. It's working for me ... although I'm now struggling with getting that widget area exactly where I want it! :) That code both creates the widget area where you've specified it on the page and creates a widget area in the admin | widgets page for you to add the widgets you want to appear.

jerryc Jan 3, 2013 02:48 PM

Quote:

Originally Posted by corynicastro (Post 94488)
I would like to add a widget area to the left sidebar.

Maybe this example will help. Here's the code that I'm using, for a left sidebar 3 columns wide, a content area 7 columns wide, and right sidebar 2 columns wide:

HTML Code:

...
<div id="main" class="row">

        <div class="col3">

                [left sidebar]

        </div>
       
        <div class="col7">

                [content area]

        </div>
       
        <div class="col3">

                [right sidebar]

        </div>
       
</div>
...

You can see it live here.

You can do this however you want, as long as the column widths in each row add up to 12.

Michael4fm Jan 3, 2013 03:47 PM

Quote:

Originally Posted by corynicastro (Post 94488)
I am beginning to worry that maybe my skill level is just too low to use it.

Please don't let that worry you. In fact, it'll probably HELP you in that you'll follow the very good instructions and not try to bring things you know from using other themes. The format of using MONTEZUMA seems quite a bit different to other themes, yet actually both simple and powerful if you don't get too hung up with 'how you used to do it'.

Also - from my limited experience - the members and moderators here are helpful, knowledgeable and quick! So if all else fails, you can always ask. ;)

corynicastro Feb 3, 2013 10:51 AM

Thanks for help, both of you, but I'm clearly too stupid: neither of these suggestions worked, probably because I am not putting them in the right places and I dont know how to figure this out. Im really trying but feeling defeated. I just want to add another widget area to the left side of my site so that it appears everywhere

juggledad Feb 3, 2013 11:37 AM

very simple the think to remember is the numur of columns must equal 12. By default the virtual template 'index.php' looks like this
HTML Code:

<!--<div id="container">-->

<?php get_header(); ?>

<div id="main" class="row">

        <div id="content" class="cf col8">
               
                <?php bfa_content_nav( 'multinav1' ); ?>
               
                <?php bfa_loop( 'postformat' ); ?>
               
                <?php bfa_content_nav( 'multinav2' ); ?>
               
        </div>
       
        <div id="widgetarea-one" class="col4">
                <?php dynamic_sidebar( 'Widget Area ONE' ); ?>
        </div>

</div>
       
<?php get_footer(); ?>

<!--</div>-->

condensed and with the right widget area set off with '=====', it looks like this
HTML Code:

<!--<div id="container">-->
<?php get_header(); ?>
<div id="main" class="row">
        <div id="content" class="cf col8">               
                <?php bfa_content_nav( 'multinav1' ); ?>               
                <?php bfa_loop( 'postformat' ); ?>               
                <?php bfa_content_nav( 'multinav2' ); ?>               
        </div>       
==========================================================
        <div id="widgetarea-one" class="col4">
                <?php dynamic_sidebar( 'Widget Area ONE' ); ?>
        </div>
==========================================================
</div>       
<?php get_footer(); ?>
<!--</div>-->

notice that the div above it has 'col8' and this div has 'col4'. to make a left sidebar just copy that code, put it in front of the 'content' div and adjust all teh 'coln's so they equal 12. Here is an example and I renamed the widget areas
HTML Code:

<!--<div id="container">-->
<?php get_header('three'); ?>
<div id="main" class="row">
        <div id="widgetarea-left" class="col3">
                <?php dynamic_sidebar( 'leftsidebar' ); ?>
        </div>
        <div id="content" class="cf col6">               
                <?php bfa_content_nav( 'multinav1' ); ?>
                <?php bfa_loop( 'postformat' ); ?>               
                <?php bfa_content_nav( 'multinav2' ); ?>               
        </div>       
        <div id="widgetarea-right" class="col3">
                <?php dynamic_sidebar( 'rightsidebar' ); ?>
        </div>
</div>       
<?php get_footer(); ?>
<!--</div>-->

now you have a left and right sidebar and a center area.

qbuster Feb 15, 2013 08:47 PM

Quote:

Originally Posted by juggledad (Post 95997)
very simple the thing to remember is the number of columns must equal 12. By default the virtual template 'index.php' looks like this:

Ok I think I understand the code you provided, and I've found 'the virtual template 'index.php' under MZ Option/Main Templates.

What I want to achieve is to have a third column on the left in which I can insert a category index.

Following your post's instructions I have changed (irritatingly I find there are no Copy/Paste options in the right-click popup menu so I have to resort to ctrl-c and ctrl-v) index.php to the following and saved the changes and added some content via Appearance/Widgets.

In the Widget area I now have Widget Area One, Widget Area Two which, as it isn't in the code below I presume is some sort of hangover from a previous attempt?

Could someone explain the significance of the div id='widgetareaone' and dydnamic_sidebar settings of 'leftsidebar'
and 'rightsidebar'?

Thanks

Will
Quote:

<!--<div id="container">-->

<?php get_header(); ?>

<div id="main" class="row">

<div id="widgetarea-one" class="col3">
<?php dynamic_sidebar( 'leftsidebar' ); ?>
</div>

<div id="content" class="cf col6">
<?php bfa_content_nav( 'multinav1' ); ?>
<?php bfa_loop( 'postformat' ); ?>
<?php bfa_content_nav( 'multinav2' ); ?>
</div>

<div id="widgetarea-one" class="col3">
<?php dynamic_sidebar( 'rightsidebar' ); ?>
</div>

</div>

<?php get_footer(); ?>

<!--</div>-->

lmilesw Feb 15, 2013 11:29 PM

The IDs are for CSS styling specific to that one sidebar. You can't have two IDs the same so in your case you might give an ID of left-sidebar to the left sidebar and right-sidebar to the right in case you ever want to style them differently.

juggledad Feb 16, 2013 03:33 AM

There s still a widget area 'Widget area One' because you only changed the 'index.php' virtual template, but it still exists in the other templates.

If you go to your blog page, you will see two sidebars but go to a page page and you will see one. Why? because there are different templates that will be used. Look at all teh different main templates and to see how they are used by WordPress, check out the template hierarchy in teh wordpress codex (google search 'template hierarchy')

Kaori29 Mar 3, 2013 04:45 AM

1 Attachment(s)
Quote:

Originally Posted by juggledad (Post 95997)
notice that the div above it has 'col8' and this div has 'col4'. to make a left sidebar just copy that code, put it in front of the 'content' div and adjust all teh 'coln's so they equal 12. Here is an example and I renamed the widget areas
HTML Code:

<!--<div id="container">-->
<?php get_header('three'); ?>
<div id="main" class="row">
        <div id="widgetarea-one" class="col3">
                <?php dynamic_sidebar( 'leftsidebar' ); ?>
        </div>
        <div id="content" class="cf col6">               
                <?php bfa_content_nav( 'multinav1' ); ?>
                <?php bfa_loop( 'postformat' ); ?>               
                <?php bfa_content_nav( 'multinav2' ); ?>               
        </div>       
        <div id="widgetarea-one" class="col3">
                <?php dynamic_sidebar( 'rightsidebar' ); ?>
        </div>
</div>       
<?php get_footer(); ?>
<!--</div>-->

now you have a left and right sidebar and a center area.

I tried this code and thats the result -> see attached picture

the foto should bee in the left sidebar, the text in the middel and the right side disappeared and i dont know why!!

juggledad Mar 3, 2013 05:30 AM

in what widget area did you put the widgets?
what is the url?

also change the ID's like this
HTML Code:

<!--<div id="container">-->
<?php get_header('three'); ?>
<div id="main" class="row">
        <div id="widgetarea-left" class="col3">
                <?php dynamic_sidebar( 'leftsidebar' ); ?>
        </div>
        <div id="content" class="cf col6">               
                <?php bfa_content_nav( 'multinav1' ); ?>
                <?php bfa_loop( 'postformat' ); ?>               
                <?php bfa_content_nav( 'multinav2' ); ?>               
        </div>       
        <div id="widgetarea-right" class="col3">
                <?php dynamic_sidebar( 'rightsidebar' ); ?>
        </div>
</div>       
<?php get_footer(); ?>
<!--</div>-->


Kaori29 Mar 3, 2013 06:03 AM

Thank you. It worked :)

But know a wanted to put in another plugin/widget.
Its called "about the author".
But i think my sidebar is to small to display it.

Is it possible to make the sidebars more "wide" then togehter "12"??

juggledad Mar 3, 2013 09:06 AM

do you mean you want bunch of widgets side by side or one on top of the other?

stlboilers Sep 24, 2014 12:52 PM

Hi, I have added a sidebar and added the code to a new template, subpage template. However, the sidebar, which is a left navigation widget, displays at top of the content area with the main content stacked below it. We would like the navigation (and rotating image slider that's in the sidebar widget) to display in a left column and the main body content to display in a right column. We can't figure out how to do that. Can you please help?

template:

HTML Code:

get_header(); ?>

<div class="container content page">

<div class="left-sidebar">

<?php
  if(function_exists('dynamic_sidebar') && dynamic_sidebar('smk_sidebar_20dd')) :
    endif;
?>


</div>

<div class="container content page">

  <?php the_post(); ?>
  <?php get_template_part( 'content', 'page' ); ?>
</div>
</div>
<!-- end container -->

CSS:

HTML Code:

#left-sidebar{/* First Column */ width:240px !important; float:left; margin-left: 20px;}       
#container content page{width:700px; float:right}


juggledad Sep 24, 2014 01:21 PM

To use a left sidebar instead ofd a right sidebar do the following
1) edit (or make a copy of the virtual main template) index.php which should look like this
HTML Code:

<!--<div id="container">-->

<?php get_header(); ?>

<div id="main" class="row">

        <div id="content" class="cf col8">
               
                <?php bfa_content_nav( 'multinav1' ); ?>
               
                <?php bfa_loop( 'postformat' ); ?>
               
                <?php bfa_content_nav( 'multinav2' ); ?>
               
        </div>
       
        <div id="widgetarea-one" class="col4">
                <?php dynamic_sidebar( 'Widget Area ONE' ); ?>
        </div>

</div>
       
<?php get_footer(); ?>

<!--</div>-->

2) find the section
HTML Code:

        <div id="widgetarea-one" class="col4">
                <?php dynamic_sidebar( 'Widget Area ONE' ); ?>
        </div>

and move it right after the line
HTML Code:

<div id="main" class="row">
so you end up with this
HTML Code:

<!--<div id="container">-->

<?php get_header(); ?>

<div id="main" class="row">

        <div id="widgetarea-one" class="col4">
                <?php dynamic_sidebar( 'Widget Area ONE' ); ?>
        </div>

        <div id="content" class="cf col8">
               
                <?php bfa_content_nav( 'multinav1' ); ?>
               
                <?php bfa_loop( 'postformat' ); ?>
               
                <?php bfa_content_nav( 'multinav2' ); ?>
               
        </div>
       
</div>
       
<?php get_footer(); ?>

<!--</div>-->

You now will have the widget azrea on the left instead of the right. If you want this to be different than the right sidebar, chang the name of the ID and widget name, like this
HTML Code:

        <div id="widgetarea-left-sidebar" class="col4">
                <?php dynamic_sidebar( 'Widget Area LEFT SIDEBAR' ); ?>
        </div>


stlboilers Oct 8, 2014 01:07 PM

Thank you for your help! With your guidance, I was able to add the left sidebar and I'm very close to where I want it to be. However, the center body section wraps at the "bottom" of the left sidebar container. I could change the height of the left sidebar container but it would push the length of the page to always be that height. In addition, as you can see, sometimes the body content section is not displaying to the right of the left sidebar. What do I need to do? Thank you!

juggledad Oct 8, 2014 03:55 PM

please export your Montezuma settings and attach them to a response

Are you using any table or forms plugins on those pages?
if so, what's it look like if you shut them off?

CrouchingBruin Oct 9, 2014 02:25 PM

The site doesn't look like it was built using the Montezuma theme, at least, not from what I can tell from examining it.


All times are GMT -6. The time now is 11:01 PM.

Powered by vBulletin® Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.