Please critique my site :)

(also, I dream of having a floating sidebar and infinite scrolling, but can’t figure out how to make that happen)

You’re site looks pleasant – nice job! Especially for a beginner.

As for infinite scrolling, take a look at this plugin.

And regarding a floating side bar, do you just mean a side bar that is always on the page, as you scroll down? That is fairly simple with CSS:

#sidebar{position:fixed; top:10px; right:10px; width:230px;}

Just put that into your style.css file – looks like #sidebar is around line 312.

NitrousCloud,

Thank you for your quick response!

I pasted the code into the stylesheet file after line 312 and nothing happened. Should I have deleted something as well?

Also, I installed and activated the Infinite Scroll plugin and nothing happened. Should I deactivate WP-Paginate and WP-Page Numbers?

Vince

Hello Vince,

Regarding the floating sidebar, here is what you have:

#sidebar {
    margin: 0;
#sidebar{position:fixed; top:10px; right:10px; width:230px;}
}

but if should just be:

#sidebar {
    margin: 0; position:fixed; top:10px; right:10px; width:230px;
}

See how that works?

Basically, HTML is made up of elements, and those elements use CSS to manipulate them. Elements have various defaults – for instance, an <IMG> element (for images) stays inline with the text. But <DIV> doesn’t stay inline, it occupies an entire section for itself.

Each element can be labeled with what is called an ID or a CLASS. ID’s can only be used once, CLASS can be used an unlimited amount of times. So, imagine you have one header, you might use an ID (ID="header"). But you may have a ton of buttons, so you could use a CLASS on everyone over and over (like CLASS="button").

To reference elements in the css, you use a period (“.”) for CLASSes, and a hash sign (“#”) for IDs.

The example of the sidebar, #sidebar means we are referencing and element with an ID labeled sidebar. We then wrap everything we apply using the CSS in curly brackets, like this { my css goes here }.

Each CSS effect follows this structure: Name Of Style: Style parameter;. The use of the colon and semi colon is really important.

So, in summary, it looks like class or id (. or #)NameOfElement{style:styleParameter;}

Do you see why the edit didn’t work?

Now, if you use the code I provided, the sidebar will go up into the top right corner and stay there. However, you sidebar is taller then most screens are, which means people won’t be able to see the bottom of the sidebar. You may want to just move a single element into the corner. You can easily move single elements (like your cloud tag) or the entire thing, but picking and choosing what you want to move may get tricky (you have to get your hands dirty and do some coding!).

Finally, regarding the infinite scroll, I haven’t actually used the plugin, so I can’t say for sure, though I could see where WP-paginate and WP-Page numbers may conflict. I’d have to look at your actual side to tell for sure.

NitrousCloud,

Thank you! It worked! ??

I got a little lost trying to decode the explanation above, but I’ve saved it so I can re-read it a few more times. Thank you again for your help!

Vince