web design

Typically, I blog about educational technology that the average teacher can understand. This, however, is some heavy lifting.

Here is an advanced trick for Wordpress users. This is how I removed the sidebar from one specific page (titled forum) on my wordpress site. After much searching, I found that I needed to implement conditional formatting using php.

Here’s my problem:
I wanted one single wordpress page to not have a sidebar. I wanted it to take up the entire width of the page. Makes sense for a forum, right? Not so easy…

Solution:
In the wordpress dashboard, navigate to Appearance > Editor > page.php.
On page.php, I changed:

<?php get_sidebar();; ?>

to:

<?php if(!is_page('Forum')) get_sidebar();; ?>

Here’s what that means:
Typically, wp displays the sidebar. That’s what we usually want. In this case, the exclamation point means “if it is not”. So, the php translation is, “If it’s not the Forum page, then show the sidebar.”

Perfect, so far. However, there was a blank space where the sidebar used to be. Another problem. The forum should be wider. This won’t happen, though, because my stylesheet says the page can only be 510 pixels wide.

So, I went to my stylesheet and created a div titled #widecolumn with a width of 100%.

Back on page.php, I changed the original div titled #contentleft to:

<?php if(!is_page('Forum')) { ?>
<div id="contentleft">
<?php } else { ?>
<div id="widecolumn">
<?php } ?>

Again, with the php translation: “If it’s not the Forum page, use the div #contentleft (with a width of 510 px). If it is the Forum page, use the #widecolumn div that you just made (with a width of 100%).

Yay!

I just installed Hackadelic’s Sliding Notes onto this WordPress blog. Here’s the idea: type something inside a hidden, accordion-style note. Click to reveal more info. Let’s try it in this example…

I think Sliding Notes will be helpful in my EDUC525» class. Do you see how you can click on the word EDUC525. It gives more info if you need it. Very cool. So now that it works on my page, here is how to do it on your Wordpress page:

1. Download <a href=”http://wordpress.org/extend/plugins/hackadelic-sliding-notes/”>Sliding Notes</a> on wordpress.org.
2. Install the plug-in in wp-content > plugins
3. Add <a href=”http://hackadelic.com/solutions/wordpress/sliding-notes#sample-css”>this css</a> to your style.css sheet.
4. Type this in when you want to add a note (and make sure to add square brackets): slider title="sliderbuttontitle"note here/slider

Very cool tool. Very easy to install.