Author Topic: moving left sidebar to right in some templates  (Read 10348 times)

0 Members and 1 Guest are viewing this topic.

Offline surferboy

  • Full Member
  • ***
  • Posts: 142
    • View Profile
moving left sidebar to right in some templates
« on: September 09, 2012, 01:59:09 AM »
Hi -

I have searched everywhere for the html and/or css code to change the position of our sidebar from left to right.  I don't want to do this on every template (not the home.html but most of the rest). 

Can anyone suggest the code to use or the file to open to change the sidebar position?

Thanks,

Brian

Rembrandt

  • Guest
Re: moving left sidebar to right in some templates
« Reply #1 on: September 09, 2012, 06:07:20 AM »
Hi!

as example the categories.html, note the comment lines.
the old  categories.html:
Code: [Select]
{header}
<table width="960" border="0" cellspacing="0" cellpadding="0" align="center">
  <tr>
    <td>
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="tablehead">
        <tr>
          <td width="100%" colspan="4"><table cellpadding="0" cellspacing="0" width="100%">
            <tr>
              <td width="6"><img src="{template_url}/images/header_top_left.gif" width="6" height="6" alt="" /></td>
              <td width="100%"><img src="{template_url}/images/header_top.gif" width="100%" height="6" alt="" /></td>
              <td width="6"><img src="{template_url}/images/header_top_right.gif" width="6" height="6" alt="" /></td>
            </tr>
            </table>
          </td>
        </tr>
        <tr>
          <td width="6"><img src="{template_url}/images/header_left.gif" width="6" height="60" alt="" /></td>
          <td width="100%"><img src="{template_url}/images/header_logo.gif" width="405" height="60" alt="" /></td>
          <td width="225" align="right">
            <form method="post" action="{url_search}">
              <table border="0" cellspacing="0" cellpadding="1">
                <tr>
                  <td>
                    <input type="text" name="search_keywords" size="15" class="searchinput" />
                  </td>
                  <td>
                    <input type="submit" value="{lang_search}" class="button" name="submit" />
                  </td>
                </tr>
                <tr valign="top">
                  <td colspan="2"><a href="{url_search}" class="smalltext">{lang_advanced_search}</a></td>
                </tr>
              </table>
            </form>
          </td>
          <td align="right" width="6"><img src="{template_url}/images/header_right.gif" width="6" height="60" alt="" /></td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td class="bordercolor">
      <table width="100%" border="0" cellspacing="1" cellpadding="0">
        <tr>
          <td class="tablebgcolor">
            <table width="100%" border="0" cellspacing="1" cellpadding="0">
              <tr>
                <td class="navbar" height="23">
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td><img src="{template_url}/images/spacer.gif" width="4" height="4" alt="" />{clickstream}</td>
                      <td align="right">
                        <a href="{url_top_images}"><b>{lang_top_images}</b></a>&nbsp;
                        <a href="{url_new_images}"><b>{lang_new_images}</b></a>&nbsp;
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
            </table>
            <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
<!-- header end -->              
<!-- left sidebar start -->
                <td width="150" class="row2" valign="top">
                  <table width="150" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td class="head2" height="20"><img src="{template_url}/images/spacer.gif" alt="" width="4" height="4" />{lang_registered_user}</td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                    <tr>
                      <td align="center" class="row1">{user_box} </td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                  </table>
                  {if random_cat_image}
                  <table width="150" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td class="head2" height="20"> <img src="{template_url}/images/spacer.gif" alt="" width="4" height="4" />{lang_random_image}</td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                    <tr>
                      <td align="center" class="row1">
                        <br />
                        {random_cat_image}
                        <br />
                        <br />
                      </td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                  </table>
                  {endif random_cat_image}
                </td>
<!-- left sidebar end -->
<!-- vertical line between left sidebar and mid content start -->
                <td width="1" class="bordercolor" valign="top"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
<!-- vertical line between left sidebar and mid content end -->
<!-- middle content start -->
                <td width="18" valign="top"><img src="{template_url}/images/spacer.gif" alt="" width="18" height="18" /></td>
                <td width="100%" valign="top"><br />
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td><b class="title">{cat_name}</b></td>
                      <td align="right" valign="bottom">{multi_upload_button}&nbsp;{upload_button}</td>
                    </tr>
                  </table>
                  <br />{cat_description} (Hits: {cat_hits})
                  <hr size="1">
                  <table width="100%" border="0" cellspacing="0" cellpadding="1">
                    <tr>
                      <td class="bordercolor">
                        <table width="100%" border="0" cellspacing="0" cellpadding="3">
                            <tr valign="top">
                              <td class="row2" > {if prev_cat_name}{lang_prev_cat}<br>&nbsp;&nbsp;
                                <b><a href="{prev_cat_url}">{prev_cat_name}</a></b>{endif prev_cat_name}&nbsp;
                              </td>
                              <td align="right" class="row2"> &nbsp;{if next_cat_name}{lang_next_cat}<br>
                                <b><a href="{next_cat_url}">{next_cat_name}</a>&nbsp;&nbsp;&nbsp;</b>{endif next_cat_name}
                              </td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                    </table>
                    <br>
                    {if categories}
                    <table width="100%" border="0" cellspacing="0" cellpadding="1">
                      <tr>
                        <td class="head1">
                          <table width="100%" border="0" cellspacing="0" cellpadding="3">
                            <tr>
                              <td class="head1" valign="top">{lang_sub_categories}</td>
                            </tr>
                            <tr>
                              <td class="row2" valign="top">{categories}</td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                    </table>
                    <br />
                  {endif categories}
                  Current Page: {page}
                  <br />
                  {paging_stats}
                  <br />
                  <br />
                  {if msg}<b>{msg}</b><br /><br />{endif msg}
                  {if thumbnails}
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td class="head1">{thumbnails}</td>
                    </tr>
                  </table>
                  {endif thumbnails}
                  <br />
                  {paging}
                  <br />
                  <br />
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td>{category_dropdown_form}</td>
                      <td align="right">{setperpage_dropdown_form}</td>
                    </tr>
                  </table>
                  <p>&nbsp;</p>
                </td>
                <td width="19" valign="top"><img src="{template_url}/images/spacer.gif" alt="" width="19" height="19" /></td>
<!-- mid content end -->
<!-- footer start -->
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td>
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="tablebottom">
        <tr>
          <td width="6" nowrap><img src="{template_url}/images/footer_left.gif" width="6" height="19" alt="" /></td>
          <td width="100%"></td>
          <td width="6" nowrap><img src="{template_url}/images/footer_right.gif" width="6" height="19" alt="" /></td>
        </tr>
      </table>
    </td>
  </tr>
</table>
{footer}

Now move the "vertical line" between left sidebar and mid content, below the "mid content", and thereafter the "left sidebar", below the "vertical line".
Code: [Select]
{header}
<table width="960" border="0" cellspacing="0" cellpadding="0" align="center">
  <tr>
    <td>
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="tablehead">
        <tr>
          <td width="100%" colspan="4"><table cellpadding="0" cellspacing="0" width="100%">
            <tr>
              <td width="6"><img src="{template_url}/images/header_top_left.gif" width="6" height="6" alt="" /></td>
              <td width="100%"><img src="{template_url}/images/header_top.gif" width="100%" height="6" alt="" /></td>
              <td width="6"><img src="{template_url}/images/header_top_right.gif" width="6" height="6" alt="" /></td>
            </tr>
            </table>
          </td>
        </tr>
        <tr>
          <td width="6"><img src="{template_url}/images/header_left.gif" width="6" height="60" alt="" /></td>
          <td width="100%"><img src="{template_url}/images/header_logo.gif" width="405" height="60" alt="" /></td>
          <td width="225" align="right">
            <form method="post" action="{url_search}">
              <table border="0" cellspacing="0" cellpadding="1">
                <tr>
                  <td>
                    <input type="text" name="search_keywords" size="15" class="searchinput" />
                  </td>
                  <td>
                    <input type="submit" value="{lang_search}" class="button" name="submit" />
                  </td>
                </tr>
                <tr valign="top">
                  <td colspan="2"><a href="{url_search}" class="smalltext">{lang_advanced_search}</a></td>
                </tr>
              </table>
            </form>
          </td>
          <td align="right" width="6"><img src="{template_url}/images/header_right.gif" width="6" height="60" alt="" /></td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td class="bordercolor">
      <table width="100%" border="0" cellspacing="1" cellpadding="0">
        <tr>
          <td class="tablebgcolor">
            <table width="100%" border="0" cellspacing="1" cellpadding="0">
              <tr>
                <td class="navbar" height="23">
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td><img src="{template_url}/images/spacer.gif" width="4" height="4" alt="" />{clickstream}</td>
                      <td align="right">
                        <a href="{url_top_images}"><b>{lang_top_images}</b></a>&nbsp;
                        <a href="{url_new_images}"><b>{lang_new_images}</b></a>&nbsp;
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
            </table>
            <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
<!-- header end -->              

<!-- middle content start -->
                <td width="18" valign="top"><img src="{template_url}/images/spacer.gif" alt="" width="18" height="18" /></td>
                <td width="100%" valign="top"><br />
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td><b class="title">{cat_name}</b></td>
                      <td align="right" valign="bottom">{multi_upload_button}&nbsp;{upload_button}</td>
                    </tr>
                  </table>
                  <br />{cat_description} (Hits: {cat_hits})
                  <hr size="1">
                  <table width="100%" border="0" cellspacing="0" cellpadding="1">
                    <tr>
                      <td class="bordercolor">
                        <table width="100%" border="0" cellspacing="0" cellpadding="3">
                            <tr valign="top">
                              <td class="row2" > {if prev_cat_name}{lang_prev_cat}<br>&nbsp;&nbsp;
                                <b><a href="{prev_cat_url}">{prev_cat_name}</a></b>{endif prev_cat_name}&nbsp;
                              </td>
                              <td align="right" class="row2"> &nbsp;{if next_cat_name}{lang_next_cat}<br>
                                <b><a href="{next_cat_url}">{next_cat_name}</a>&nbsp;&nbsp;&nbsp;</b>{endif next_cat_name}
                              </td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                    </table>
                    <br>
                    {if categories}
                    <table width="100%" border="0" cellspacing="0" cellpadding="1">
                      <tr>
                        <td class="head1">
                          <table width="100%" border="0" cellspacing="0" cellpadding="3">
                            <tr>
                              <td class="head1" valign="top">{lang_sub_categories}</td>
                            </tr>
                            <tr>
                              <td class="row2" valign="top">{categories}</td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                    </table>
                    <br />
                  {endif categories}
                  Current Page: {page}
                  <br />
                  {paging_stats}
                  <br />
                  <br />
                  {if msg}<b>{msg}</b><br /><br />{endif msg}
                  {if thumbnails}
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td class="head1">{thumbnails}</td>
                    </tr>
                  </table>
                  {endif thumbnails}
                  <br />
                  {paging}
                  <br />
                  <br />
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td>{category_dropdown_form}</td>
                      <td align="right">{setperpage_dropdown_form}</td>
                    </tr>
                  </table>
                  <p>&nbsp;</p>
                </td>
                <td width="19" valign="top"><img src="{template_url}/images/spacer.gif" alt="" width="19" height="19" /></td>
<!-- mid content end -->

<!-- vertical line between left sidebar and mid content start -->
                <td width="1" class="bordercolor" valign="top"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
<!-- vertical line between left sidebar and mid content end -->

<!-- left sidebar start -->
                <td width="150" class="row2" valign="top">
                  <table width="150" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td class="head2" height="20"><img src="{template_url}/images/spacer.gif" alt="" width="4" height="4" />{lang_registered_user}</td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                    <tr>
                      <td align="center" class="row1">{user_box} </td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                  </table>
                  {if random_cat_image}
                  <table width="150" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td class="head2" height="20"> <img src="{template_url}/images/spacer.gif" alt="" width="4" height="4" />{lang_random_image}</td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                    <tr>
                      <td align="center" class="row1">
                        <br />
                        {random_cat_image}
                        <br />
                        <br />
                      </td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                  </table>
                  {endif random_cat_image}
                </td>
<!-- left sidebar end -->

<!-- footer start -->
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td>
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="tablebottom">
        <tr>
          <td width="6" nowrap><img src="{template_url}/images/footer_left.gif" width="6" height="19" alt="" /></td>
          <td width="100%"></td>
          <td width="6" nowrap><img src="{template_url}/images/footer_right.gif" width="6" height="19" alt="" /></td>
        </tr>
      </table>
    </td>
  </tr>
</table>
{footer}

next example, the member.html:
old:
Code: [Select]
{header}
<table width="960" border="0" cellspacing="0" cellpadding="0" align="center">
  <tr>
    <td>
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="tablehead">
        <tr>
          <td width="100%" colspan="4"><table cellpadding="0" cellspacing="0" width="100%">
            <tr>
              <td width="6"><img src="{template_url}/images/header_top_left.gif" width="6" height="6" alt="" /></td>
              <td width="100%"><img src="{template_url}/images/header_top.gif" width="100%" height="6" alt="" /></td>
              <td width="6"><img src="{template_url}/images/header_top_right.gif" width="6" height="6" alt="" /></td>
            </tr>
            </table>
          </td>
        </tr>
        <tr>
          <td width="6"><img src="{template_url}/images/header_left.gif" width="6" height="60" alt="" /></td>
          <td width="100%"><img src="{template_url}/images/header_logo.gif" width="405" height="60" alt="" /></td>
          <td width="225" align="right">
            <form method="post" action="{url_search}">
              <table border="0" cellspacing="0" cellpadding="1">
                <tr>
                  <td>
                    <input type="text" name="search_keywords" size="15" class="searchinput" />
                  </td>
                  <td>
                    <input type="submit" value="{lang_search}" class="button" name="submit" />
                  </td>
                </tr>
                <tr valign="top">
                  <td colspan="2"><a href="{url_search}" class="smalltext">{lang_advanced_search}</a></td>
                </tr>
              </table>
            </form>
          </td>
          <td align="right" width="6"><img src="{template_url}/images/header_right.gif" width="6" height="60" alt="" /></td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td class="bordercolor">
      <table width="100%" border="0" cellspacing="1" cellpadding="0">
        <tr>
          <td class="tablebgcolor">
            <table width="100%" border="0" cellspacing="1" cellpadding="0">
              <tr>
                <td class="navbar" height="23">
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td><img src="{template_url}/images/spacer.gif" width="4" height="4" alt="" />{clickstream}</td>
                      <td align="right">
                        <a href="{url_top_images}"><b>{lang_top_images}</b></a>&nbsp;
                        <a href="{url_new_images}"><b>{lang_new_images}</b></a>&nbsp;
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
            </table>
            <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
<!-- header end -->
<!-- left sidebar start -->
                <td width="150" class="row2" valign="top">
                  <table width="150" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td class="head2" height="20"><img src="{template_url}/images/spacer.gif" alt="" width="4" height="4" />{lang_registered_user}</td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                    <tr>
                      <td align="center" class="row1">{user_box}</td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                  </table>
                  {if random_image}
                  <table width="150" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td class="head2" height="20"> <img src="{template_url}/images/spacer.gif" alt="" width="4" height="4" />{lang_random_image}</td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                    <tr>
                      <td align="center" class="row1">
                        <br />
                        {random_image}
                        <br />
                        <br />
                      </td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                  </table>
                  {endif random_image}
                </td>
<!-- left sidebar end -->
<!-- vertical line between left sidebar and mid content start -->
                <td width="1" class="bordercolor" valign="top"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
<!-- vertical line between left sidebar and mid content end -->
<!-- middle content start -->
                <td width="18" valign="top"><img src="{template_url}/images/spacer.gif" alt="" width="18" height="18" /></td>
                <td width="100%" valign="top">
                  <br />
                  <span class="title">{lang_control_panel}</span>
                  <hr size="1" />
                  {if msg}<b>{msg}</b><br /><br />{endif msg}
                  {content}
                  <p>&nbsp;</p>
                </td>
                <td width="19" valign="top"><img src="{template_url}/images/spacer.gif" alt="" width="19" height="19" /></td>
<!-- mid content end -->
<!-- footer start -->
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td>
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="tablebottom">
        <tr>
          <td width="6" nowrap><img src="{template_url}/images/footer_left.gif" width="6" height="19" alt="" /></td>
          <td width="100%"></td>
          <td width="6" nowrap><img src="{template_url}/images/footer_right.gif" width="6" height="19" alt="" /></td>
        </tr>
      </table>
    </td>
  </tr>
</table>
{footer}

and the new:
Code: [Select]
{header}
<table width="960" border="0" cellspacing="0" cellpadding="0" align="center">
  <tr>
    <td>
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="tablehead">
        <tr>
          <td width="100%" colspan="4"><table cellpadding="0" cellspacing="0" width="100%">
            <tr>
              <td width="6"><img src="{template_url}/images/header_top_left.gif" width="6" height="6" alt="" /></td>
              <td width="100%"><img src="{template_url}/images/header_top.gif" width="100%" height="6" alt="" /></td>
              <td width="6"><img src="{template_url}/images/header_top_right.gif" width="6" height="6" alt="" /></td>
            </tr>
            </table>
          </td>
        </tr>
        <tr>
          <td width="6"><img src="{template_url}/images/header_left.gif" width="6" height="60" alt="" /></td>
          <td width="100%"><img src="{template_url}/images/header_logo.gif" width="405" height="60" alt="" /></td>
          <td width="225" align="right">
            <form method="post" action="{url_search}">
              <table border="0" cellspacing="0" cellpadding="1">
                <tr>
                  <td>
                    <input type="text" name="search_keywords" size="15" class="searchinput" />
                  </td>
                  <td>
                    <input type="submit" value="{lang_search}" class="button" name="submit" />
                  </td>
                </tr>
                <tr valign="top">
                  <td colspan="2"><a href="{url_search}" class="smalltext">{lang_advanced_search}</a></td>
                </tr>
              </table>
            </form>
          </td>
          <td align="right" width="6"><img src="{template_url}/images/header_right.gif" width="6" height="60" alt="" /></td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td class="bordercolor">
      <table width="100%" border="0" cellspacing="1" cellpadding="0">
        <tr>
          <td class="tablebgcolor">
            <table width="100%" border="0" cellspacing="1" cellpadding="0">
              <tr>
                <td class="navbar" height="23">
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td><img src="{template_url}/images/spacer.gif" width="4" height="4" alt="" />{clickstream}</td>
                      <td align="right">
                        <a href="{url_top_images}"><b>{lang_top_images}</b></a>&nbsp;
                        <a href="{url_new_images}"><b>{lang_new_images}</b></a>&nbsp;
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
            </table>
            <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
<!-- header end -->

<!-- middle content start -->
                <td width="18" valign="top"><img src="{template_url}/images/spacer.gif" alt="" width="18" height="18" /></td>
                <td width="100%" valign="top">
                  <br />
                  <span class="title">{lang_control_panel}</span>
                  <hr size="1" />
                  {if msg}<b>{msg}</b><br /><br />{endif msg}
                  {content}
                  <p>&nbsp;</p>
                </td>
                <td width="19" valign="top"><img src="{template_url}/images/spacer.gif" alt="" width="19" height="19" /></td>
<!-- mid content end -->
<!-- vertical line between left sidebar and mid content start -->
                <td width="1" class="bordercolor" valign="top"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
<!-- vertical line between left sidebar and mid content end -->
<!-- left sidebar start -->
                <td width="150" class="row2" valign="top">
                  <table width="150" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td class="head2" height="20"><img src="{template_url}/images/spacer.gif" alt="" width="4" height="4" />{lang_registered_user}</td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                    <tr>
                      <td align="center" class="row1">{user_box}</td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                  </table>
                  {if random_image}
                  <table width="150" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td class="head2" height="20"> <img src="{template_url}/images/spacer.gif" alt="" width="4" height="4" />{lang_random_image}</td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                    <tr>
                      <td align="center" class="row1">
                        <br />
                        {random_image}
                        <br />
                        <br />
                      </td>
                    </tr>
                    <tr>
                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>
                    </tr>
                  </table>
                  {endif random_image}
                </td>
<!-- left sidebar end -->
<!-- footer start -->
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td>
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="tablebottom">
        <tr>
          <td width="6" nowrap><img src="{template_url}/images/footer_left.gif" width="6" height="19" alt="" /></td>
          <td width="100%"></td>
          <td width="6" nowrap><img src="{template_url}/images/footer_right.gif" width="6" height="19" alt="" /></td>
        </tr>
      </table>
    </td>
  </tr>
</table>
{footer}

mfg Andi

Offline surferboy

  • Full Member
  • ***
  • Posts: 142
    • View Profile
Re: moving left sidebar to right in some templates
« Reply #2 on: September 10, 2012, 03:24:20 AM »
Hi -

Thank you sooooooooooooooo much!  That was a big big big help!!!! I have been able to slowly modify all the non-home templates to show a right sidebar @ 300 px!

By accident or by the speed of a snail, I discovered how to add a left and right sidebar (don't laugh ... I paste first and cut second)

This discovery was also wonderful because I would like to modify the home page and put all the categories shown in the main content into a 270 px left sidebar.  Would you have any suggestions on how to do that?

Thanks so much,

Brian

Rembrandt

  • Guest
Re: moving left sidebar to right in some templates
« Reply #3 on: September 10, 2012, 05:09:34 AM »
move the code in your home.html:
Code: [Select]
                  {if categories}
                  <table width="100%" border="0" cellspacing="0" cellpadding="1">
                    <tr>
                      <td class="head1">
                        <table width="100%" border="0" cellspacing="0" cellpadding="3">
                          <tr>
                            <td class="head1" valign="top">{lang_categories}</td>
                          </tr>
                          <tr>
                            <td class="row2" valign="top">{categories}</td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                  </table>
                  <br />
                  {endif categories}

below "{endif random_image}"

go to the ACP/General/Settings/Category settings and set:
Number of table cells = 1
Table width =270

mfg Andi

Offline surferboy

  • Full Member
  • ***
  • Posts: 142
    • View Profile
Re: moving left sidebar to right in some templates
« Reply #4 on: September 10, 2012, 08:48:56 AM »
Hi -

thanks so much for the additional advice. It almost works ... by that I mean I have two sidebars, both 270 px, and almost everything is sorted except for the crucial element - categories.

When I do what you instruct, it blows the left sidebar about 800 px wide and completely messes up the screen. Yes, I have adjusted the acp category settings too ... but then the sidebar is floated halfway down the column and you have to scroll far down to see it.

Any chance I could pm or email you the code for you to take a look? I can't post it here for privacy reasons (we don't want a lot of users outside our community, if that is an acceptable explanation to the community here ? ... hope so. not trying to be a jerk).

Thanks so much.

Brian

Rembrandt

  • Guest
Re: moving left sidebar to right in some templates
« Reply #5 on: September 10, 2012, 10:55:44 AM »
...When I do what you instruct, it blows the left sidebar about 800 px wide and completely messes up the screen....
search in the code:
Code: [Select]
{if categories}
                  <table width="100%" border="0" cellspacing="0" cellpadding="1">

and replace:
Code: [Select]
{if categories}
                  <table width="270" border="0" cellspacing="0" cellpadding="1">


mfg Andi

Offline surferboy

  • Full Member
  • ***
  • Posts: 142
    • View Profile
Re: moving left sidebar to right in some templates
« Reply #6 on: September 10, 2012, 07:35:57 PM »
Hi -
Okay, this is what I have right now (partial code) without moving the categories. Everything looks great except the categories are in the center column, of course!  Also, my category settings in the ACP are set at table cell = 1 and table width = 100%.  By the way, by doing that, you helped me TRULY add polish to the categories.html pages ... and the subcategories because they all list in one column instead of 2 and it looks FANTASTIC!!!  (I have to use 100% because otherwise the subcategories display in the categories.html pages display in the 270 px width and that looks horrible.  Anyway. ...

Code: [Select]
<table width="100%" border="0" cellspacing="0" cellpadding="0">

              <tr>

  <td width="10" valign="top" nowrap><img src="{template_url}/images/spacer.gif" alt="" width="10" height="10" /></td>
 
                <td width="270" class="row2" valign="top">

                  <table width="270" border="0" cellspacing="0" cellpadding="0">

                    {if random_image}

                    <tr>

                      <td class="head2" height="20"> <img src="{template_url}/images/spacer.gif" alt="" width="4" height="4" />{lang_random_image}</td>

                    </tr>

                   

                    <tr>

                      <td align="center" class="row2">

                    <br>

                        {random_image}

                    <br>

                    <br>

                      </td>

                    </tr>

                    <tr>

                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>

                    </tr>

                    {endif random_image}

                    <tr>

<tr>

                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="10" /></td>

                    </tr>

<td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" />
                    {lang_site_stats}<br />
</td>

<tr>

                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="10" /></td>

                    </tr>

                  </table>

 

                </td>

Now I move the code as you instruct, cutting it from the center column and pasting it in the sidebar. That doesn't work. It creates a huge gap on the right of the left sidebar. So then I edited more of the table widths, and even the breadcrumb bar, changing everything to 270, as shown below. yes the left sidebar loses the huge gap but it appears way down on the page on the left and the background of the center column now has the color of the background of the entire 4images... dark grey instead of the light blue ...

Code: [Select]
<td class="bordercolor">

      <table width="100%" border="0" cellspacing="0" cellpadding="0">

        <tr>

          <td class="tablebgcolor">

             <table width="270" border="0" cellspacing="1" cellpadding="0" align="center">

<tr>

                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="10" /></td>

                    </tr>

              <tr>

                <td class="navbar2" height="19">

                  <table width="100%" border="0" cellspacing="0" cellpadding="0">

                    <td><img src="{template_url}/images/spacer.gif" width="4" height="4" alt="" />{clickstream}</td>

                    </tr>

                  </table>

                </td>

              </tr>

            </table><br />

            <table width="270" border="0" cellspacing="0" cellpadding="0">

              <tr>

  <td width="10" valign="top" nowrap><img src="{template_url}/images/spacer.gif" alt="" width="10" height="10" /></td>
 
                <td width="270" class="row2" valign="top">

                  <table width="270" border="0" cellspacing="0" cellpadding="0">

                    {if random_image}

                    <tr>

                      <td class="head2" height="20"> <img src="{template_url}/images/spacer.gif" alt="" width="4" height="4" />{lang_random_image}</td>

                    </tr>

                   

                    <tr>

                      <td align="center" class="row2">

                    <br>

                        {random_image}

                    <br>

                    <br>

                      </td>

                    </tr>

                    <tr>

                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" /></td>

                    </tr>

                    {endif random_image}

                    <tr>

<tr>

                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="10" /></td>

                    </tr>

<td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="1" />
                    {lang_site_stats}<br />
</td>

{if categories}

                  <table width="270" border="0" cellspacing="0" cellpadding="1">

                    <tr>

                      <td class="head1">

                        <table width="100%" border="0" cellspacing="0" cellpadding="3">

                          <tr>

                            <td class="head1" valign="top">{lang_categories}</td>

                          </tr>

                          <tr>

                            <td class="row2" valign="top">{categories}</td>

                          </tr>

                        </table>

                      </td>

                    </tr>

                  </table>

                  <br />

                  {endif categories}

<tr>

                      <td class="tablebgcolor"><img src="{template_url}/images/spacer.gif" alt="" width="1" height="10" /></td>

                    </tr>

                  </table>

 

                </td>

Thank you so much for looking at this.

Brian



Offline surferboy

  • Full Member
  • ***
  • Posts: 142
    • View Profile
Re: moving left sidebar to right in some templates
« Reply #7 on: September 11, 2012, 10:08:37 PM »
hooray!!! I solved the issue myself.

this is what was needed: delete both sets of tables so the code looks like this:

Code: [Select]
{if categories}

                 

                    <tr>

                      <td class="head2">

                       

                          <tr>

                            <td class="head2" height="20"><img src="{template_url}/images/spacer.gif" alt="" width="4" height="4" />{lang_categories}</td>

                          </tr>

                          <tr>

                            <td class="row2" valign="top">{categories}</td>

                          </tr>

                       

                      </td>

                    </tr>

                 

               

                  {endif categories}

Thanks again for you help and time!