Remove / Edit Sidebar WordPress Surfarama theme

Surfarama is in my opinion the best WordPress theme, the only thing that baugthers me is the sidebar in posts. I think it’s a little bit too wide and I want to remove this in order to get more space for content. This is my first post in English because when I search in my native language (Dutch) I cannot find any solutions for this problem, so I started google in English and still no solution. So after a few minutes studying the surfarama layout I found an easy solution for this little problem. Make sure that before you start removing the sidebar that you make a back-up of your site. If you don’t know how, click here for the Dutch tutorial I wrote earlier.

How to remove the Surfarama sidebar?

1. Remove in Single Post (single.php):

Now we have removed the sidebar but now there is a lot of free space on the right side to fill up with content. At the next step you see how I accomplish this.

2. Edit: Stylesheet (style.css)
Find: .col620
Replace 64.667%; to 98.0%;

Now this is nice, check the result:
surfarama_remove_sidebar

How to edit the Surfarama sidebar?

You can change the width of the sidebar in style.css, just change the percentage:

Customize widgets in the sidebar

If you copy the following sample and past it into sidebar-post.php you get a pretty good idea how the sidebar page works. If you have any questions, please let me know!

Result:

surfarama_change_sidebar_widget

See also, add Soundcloud icon

souncloud_icon_surfarama

22 Comments
  1. Hi, ik heb even een vraagje over je surfarama homepage met de post tabs.
    Hoe krijg je zoveel posts op 1 pagina? (bij mij gaat ie naar 5 of 6 post verder met een nieuwe pagina)

    Grt Dagmar

  2. Hoi Dagmar,

    Dan ga je naar Settings, Reading en daar verander je het aantal bij Blog pages show at most.

    Gr Tommie

  3. Hee Tom! Ik vroeg me af hoe jij die slider op je homepage hebt gekregen en niet op je categorie pagina’s? En in welk gedeelte heb je de code ingevoerd? Ben benieuwd, hoop dat je wilt helpen!

  4. Hoi Roel, de code kun je op 2 manieren aanpassen. 1 via de FTP zelf en dan naar WP-content, themes, surfarama en vervolgens sidebar-post.php aanpassen en overschrijven. En 2 in het admin gedeelte van WordPress via Appearance en dan editor en daar klik je ook op sidebar-post.php. Laat maar weten als je er niet uitkomt!

  5. Hee Tom, Moet ik ook bij die sidebar-post.php zijn voor de homepage? Want het ging me vooral om de slider die jij bovenaan je homepage hebt? Ik dacht zelf eerder aan index.php of home-page-with-intro.php dat ik daar een shortcode in moest voeren? Ben benieuwd!

  6. Hee Roel, voor die slider gebruik ik de plugin Meta Slider Lite. Die php code (genereert de plugin voor je) heb ik bovenaan de main index gezet, maar je kunt hem ook in de header zetten.

  7. Hoi Tom, ik heb ook dit thema voor mijn website gekozen, en ik probeer nu een google adsense in het witte zijvlak te krijgen, maar wat ik ook probeer, ik blijf hem alleen maar beneden op mijn pagina zien… Ik ben echt een leek met dit soort dingen. Heb jij enig idee hoe ik advertenties ergens ander krijg dan alleen helemaal onderaan (waar niemand ze ziet?)? Ik heb al diverse plugins gebruikt, maar ik krijg het maar niet voor elkaar. Ik hoop dat jij kunt helpen. Groet, Petra

  8. Hey Petra, in dat geval zou ik de advertentie in de sidebar toevoegen via de widgets (zit bij Appearance). Daar kies je voor Tekst en zet je de code in de widget. Vervolgens kun je de widget toevoegen aan de sidebar en op 1 instellen zodat hij bovenaan komt te staan. Mocht dit niet lukken dan wil ik wel even voor je kijken. Groet, Tommie

  9. Hoi Tommie, ik krijg het niet voor elkaar, hij staat nu wel op een andere plek, maar nog steeds helemaal onderaan en dwars door andere dingen heen… Ik heb tekst gekozen en dan de code erin gekopieerd. Maar ik kan de widget alleen toevoegen aan homepage, category/archive, posts, page of full page. Maar ik zie dus nergens sidebar staan..
    Groet,
    petra

  10. Hee Petra, ik stuur je even een mailtje met uitleg omdat ik codes niet in de comments kan zetten.. Hopelijk lukt het nu wel! Gr Tommie

  11. Hi Criss, yes there is! You can by not editing the sidebar add widgets. If that doesn’t work you can manually add the aside code.

  12. Umm, this will sound silly, but I’m really new to this whole thing, so… How exactly do I do that, if you don’t mind telling me? :)

  13. No problem.. Go to Appearance and than Widgets to add a sidebar. There you can change everything in the sidebar. So you can change the order, add content to the sidebar or remove stuff. Hopefully this is helping

  14. Thank you. I already did that, but I still can’t get any SIDE bar on the home page, I only have widgets at the bottom of the page, under all the articles. What I would like would be to have some widgets on the side of the page on the home page, and not only on the post pages and category pages. Thanks for the reply!

  15. Probably your theme doesn’t support these kinds of possibilities, are you having the Surfarama theme?

  16. Alright, if you go to sidebar-post.php and add the aside code you should see an extra empty widget. In this “empty widget” you should copy a code to: Put your code or text in here. By this way you can remove or add as many sidebar blocks. If you want to remove widgets you delete aside. If this doesn’t help I can make a YouTube video to explain it more if you like.

  17. Hi Tom, als ik de aside code in de sidebar-post.php plak, dan zie ik wel in de sidebar van een post aan de rechterkant de advertentie, maar ik krijg niets op de homepage te zien aan de rechterkant. En Criss schijnbaar wel,,, :) Wat kan ik verkeerd doen? Groet, Petra

  18. Hey Petra, het probleem is een beetje dat er geen sidebar module aanwezig is op de homepage. Dus ik ga later even kijken of ik hier een simpele oplossing voor kan maken. Ik houd je op de hoogte!

Laat een bericht achter