Grey OnePage

[Timbow]

    Uploaded to Extend

It's all grey but I made it as a basis for something colourful. Responsive with a simple mobile toggle menu which is all css because I don't know much javascript. Smooth scrolling single page site so all the pages are in one long column and the nav menu scrolls it up and down.

To give pages backgrounds there are some sample lines of css at the end of the layout.css file. To make multi column pages use the skeleton 16 column classes but I think you will have to disable the CKEditor.

Custom Permalink in Settings must be set to #%slug% The index page holds the others and has no content of its own, so delete the default content and take it out of the menu. The index Page Title is used as the html title but does not appear in the body. Make pages in the normal way and put them in the menu. Insert Page Titles manually into the page content if you want to see them.

[datiswous]

Hey Timbow, can you please add the link to the one-page navigation code from Carlos?

[Timbow]

Hey Timbow, can you please add the link to the one-page navigation code from Carlos?

http://get-simple.info/forums/showthread...9#pid43789

[Timbow]

Really nice site made by erka with this theme
http://www.moodifier.co.uk 
http://www.moodifier.se (in Swedish)

[shawn_a]

What code support do you guys need in 3.4 for single page themes? Suggestions?

[lakaroth]

Tested with GS 3.3.7
Installed>Change theme> NO PLUGIN
i have a problem:

I cant see the "HOME" contents, if i create other pages and add to menù everything is OK but there's no "home" content.
Also in the administration panel, under PAGES tab, i cant delete the Home page byt default (Welcome to getsimple etc etc)
Why?

[Timbow]

Tested with GS 3.3.7
Installed>Change theme> NO PLUGIN
i have a problem:

I cant see the "HOME" contents, if i create other pages and add to menù everything is OK but there's no "home" content.
Also in the administration panel, under PAGES tab, i cant delete the Home page byt default (Welcome to getsimple etc etc)
Why?

That's how it is with that code for making a single page site. You don't have a problem as such. You can never delete the index page, and with this system all the other pages are inserted into index.html  so the index has no content of it s own. That's how it works.

[lakaroth]

Excuse me guys, i don't understand how to customize pages, as in the sample:

http://www.cyberpress.biz/
There's the wood background in "features" i need to modify template.php for each pages?

If i put in the editor page something like this:

Code:

<div class="anchor" id="features">
    <div class="wrapper">
        <div class="container pagecontent">
            <h2>All Cyber Press Websites are&nbsp;:-</h2>
            <div class="one-third column">
                <h3>Responsive</h3>
                <p>All Cyber Press websites are viewable on any device - from a tiny phone screen to a big desktop display. It's called <em>Responsive Design</em> because the layout responds to the size of the viewing window.<br />
                    &nbsp;&nbsp;&nbsp;—&nbsp;like this site.</p>
            </div>
            <div class="one-third column ">
                <h3>Content Managed</h3>
                <p>All Cyber Press websites are installed on Content Management Systems. If your site is one page or a hundred pages, If you update it daily, monthly or annually, then a CMS makes it easier, more secure, safer, and much more fun to manage your website.</p>
            </div>
            <div class="one-third column ">
                <h3>Google Optimised</h3>
                <p>All Cyber Press websites are optimised to be fully readable by Search Engine bots. If google recognises the relevance of your site and the quality of the content then you <strong><em>will</em></strong> get search engine traffic.<br />
                    &nbsp;&nbsp;&nbsp;—&nbsp;like this site.</p>
            </div>
            <footer class="fourteen columns offset-by-one">
                Web Designers and Internet Consultancy for Businesses, Individuals, Charities and Groups in Somerset and North Somerset: Minehead, Williton, Watchet and Cannington.</footer>
        </div>
    </div>
</div>

the result is the backround image in a box, not in full screen.
like this:




How can i fix it?

Best

[Timbow]

Looks like i hid some pointers in the layout.css :
/* #Page Styles================================================== */

/*Samples */

/* full width backgrounds */
#slug .wrapper {background: styles;}

/* just the inner */
#slug .pagecontent {background: styles;}

/* All the Inners */
.container  {background: styles; }
Does that make sense? Each 'page' is id'd by its slug, has a full width .wrapper div and an inner .pagecontent div

[lakaroth]

Now i understand, thanks a lot!

Best

[JurisR]

Thank you for your work! Very good and simple code.
But a webpage with this template is incomplete in urlbar.
#%slug% variable after anchor function execution not displayed at urlbar.
It is not good SEO!
Maybe you can make a correction in the htaccess file to remove the # on urlbar address line also?

[Timbow]

I don't know how google reads the pages of a one-page site. Are you saying that the different divs and anchors should have different urls and html titles? You might be right.

My site doesn't have #in the address bar. Don't know why that would be.

[Bill]

Looks like i hid some pointers in the layout.css :
/* #Page Styles================================================== */

/*Samples */

/* full width backgrounds */
#slug .wrapper {background: styles;}

/* just the inner */
#slug .pagecontent {background: styles;}

/* All the Inners */
.container  {background: styles; }
Does that make sense? Each 'page' is id'd by its slug, has a full width .wrapper div and an inner .pagecontent div

Hello, is it possible to have the pagecontent at width: 100% how can i do it ?

Or to have less margin left and right for the content of the pages ?

Sorry if this is a silly question, but i am a beginners.

Thanks

[Timbow]

Sort of no, or yes but not easily.

That theme uses css from the skeleton grid (old version) which makes it responsive up to 960 px width. 

Simple pages might work if you just strike out the 960px width declaration for the .container class in the skeleton css, but columns won't and it could get messy.

[Felix]

and with this system all the other pages are inserted into index.html  so the index has no content of it s own. That's how it works.

What is the advantage to make a one pager this way ?
Why not simply use the way GS already works ?