Tumblr custom... get rid of header, add a sidebar...

[mss]

Hi guys,

I'm doing a little work on the famous (or unfamous?) Native Citizens Tumblr theme.

I'd like to get rid of the header (that has a logo and menu) and add a simple left sidebar with super simple text for the blog name, and menu below.

Could anyone help? I am willing to share.

Here's a picture showing the original theme and the final result.

Thaaaanks

[Gerdus van Zyl]

Just remove the entire <header id="header"> </header> tag to remove the header & links; add a div and absolute position it for the left side bar.
If you could post the theme code and css we could be more helpful.

[mss]

Thanks alot Gerdus!

I post the code here, eventhough it's a paid theme, because it's discontinued anyway.

The ZIP file has a pwd: tumblrnative

and contains: html file and css file. The css file is actually linked in the html file and uploaded as a theme asset @ tumblr.

Again, thanks a million for the help, much appreciated!

https://dl.dropboxusercontent.com/u/27941078/tumblr/ncpro205.zip

[Gerdus van Zyl]

Here is the modified tumblr html: https://dl.dropboxusercontent.com/u/1613737/ncpro205/modified_tumblr_tpl.txt
preview here: http://ablzthemetest.tumblr.com/

Under customize untick:
Enable Search
Enable Sidebar

clear background and logo

Hope this helps :-)

added this CSS
            /* Added by Gerdus */
            #main {
                padding-left: 180px;
            }
           
           
            #header {
                display:hidden;
                height:0px;
            }
           
            #sidenav {
                position: absolute;
                left: 0;
                top: 20px;
                width: 150px;
                padding-left: 35px;               
            }
           
            #sidenav h1 {
                font-family: Lekton,Monaco,monospace;               
                text-transform: uppercase;
                font-weight: 16px;
                margin-top: 3px;
                padding-top: 0;
            }
           
            #sidenav ul {
                list-style:none;
                margin:0;
                padding:0;
            }

and this HTML:
            <div id="sidenav">
                <h1><a href="/" title="themetest" class="home" rel="home">themetest</a></h1>
                <ul>
                    <li><a href="/1">Menu Link 1</a></li>
                    <li><a href="/2">Menu Link 2</a></li>
                    <li><a href="/3">Menu Link 3</a></li>
                </ul>
            </div>

[mss]

Thank you so much Gerdus!

It works like a charm!!

Many many thanks!!