Surfarama Theme


Download Theme

Surfarama is a simple, bold and colorful theme suited to blogs and online magazines who like to feature great imagery. See this short video for a demo…

It is fairly customizable right out of the box with the ability to do the following with no coding necessary:

  • Upload your own logo
  • Add social media profiles
  • Set the primary, secondary, background and link colors
  • Choose whether to display category tabs and borders around posts on the home page and archive pages
  • Color code each category

Building a new site? Looking at hosting options? We recommend Siteground, Bluehost or GreenGeeks. You can see our complete list of all the top WordPress hosts.

Top Article:  WP Dentist
Charlie has been building WordPress themes, reviewing web hosts and utilizing social media since their respective inceptions.

294 thoughts on “Surfarama Theme

  1. steve says:

    Great theme, it looks beautiful! Is it possible to put ads in the banner or as one of the post blocks? Anywhere else the ads can go except on the bottom of the page?

    1. Ryan S says:

      Hi @steve,

      Thanks for using our theme

      Yeah it’s possible to add Ads in the right header are(Banner) you can update header.php file and put ads in there and for posts block file can be found as content.php or content-{post-type}.php

      Hope that helps

  2. Stilgherrian says:

    I suspect this is a dumb question but I can’t find the answer.

    What is the optimal sizing and proportions for post featured images etc so things fit together nicely and don’t get cropped?

    Or am I being quaintly old-fashioned about that sort of thing?

    1. Ryan S says:

      Hi @Stilgherrian,

      Thanks for using our theme

      There’s no required file size but 610 × 920 in pixel size should work

      Hope that helps

      1. Stilgherrian says:

        Thanks, Ryan. I ended up choosing 610 x 343, as I source a lot of imagery from 16:9 video, and it seems to be working OK. See… where the colours are still being worked out.

        1. Ryan S says:

          You can work on color in style.css file

  3. The Nat says:


    Here is the name of the WordPress plugin that was causing the code conflict that stopped Surfarama from tiling on my screen correctly.

    It’s the “Web Maps for WordPress Free” plugin. This is the stated website for the plugin which, oddly enough, doesn’t seem to have content anymore:

    My OS is Windows 7 Professional x64.

    1. charles Charles says:

      Thanks, glad you figured it out. Plugins are often the cause of such issues.

  4. The Nat says:

    Charles, you are a genius! Thank you for your suggestions. I have deactivated EVERY plugin and it is now “tiling” nicely:

    The “customisation” menu now works, too. Now I’ve just got to find out which bloody plugin was doing this. 🙂

    Will let you know as soon as I do, so that you can maybe make people aware of a plugin conflict.

  5. Wayne says:

    Hi, my website using your theme is starting to look great and seems to work nicely with the plugins I have been using. How can I get the social media links above the menu bar to open in a new window?

    Thanks in advance

    1. Ryan S says:

      Hi @wayne,

      Thanks for using our theme

      Those icons are located in header.php file, just add target=”_blank” in each social media anchor like so
      <a href="#" target="_blank">ICON<a>

      Hope that helps

  6. crag says:

    Hi there,
    after the last update of wordpress and surfarama, my main page just shows the last blog entry, but i cant even open the blogpost. when i click on the picture, it opens a empty page. i had no errors update wordpress or the theme and havent changed anything on the php code of wordpress or surfarama.
    i even tried to delete surfarama und reinstalled it to solve the problem, but no chance.
    can you help me?
    i have the page now running with a other theme, so i cant send you a link
    thank you

    1. charles Charles says:

      Hi Crag, I can’t really help sorry without being able to see what is going on. The Surfarama theme hasn’t been updated recently so I don’t know what update you are referring too.

  7. The Nat says:

    Just further to my last post… I’ve just updated the theme and I can no longer select any of the customisation buttons (Site Logo, Social Media Icons, Set Border For Images, etc, etc). Clicking on each button used to expand a menu before. It doesn’t seem to work now. I have tried in both Chrome and Mozilla browsers to no avail. :-/

    1. charles Charles says:

      Hi The Nat, that’s odd. Did you update anything else at the same time? I don’t know what would cause that and can’t replicate here…perhaps try another theme and see the problem still exists.

  8. The Nat says:

    Hi there. I really love the Surfarama theme but I’m having trouble getting my travel blog entries to look organised on the Home page. They don’t seem to be tiling right and I was hoping to get them to look like one of the demonstration templates I’ve seen where they are all packed together nicely without any wasted page space. For some reason, though, there’s loads of blank space and some older blogs have been given their own page, rather than be sorted into the space.
    Here is the link to my website-in-progress:

    Do you know where I am going wrong?

    1. charles Charles says:

      Hi The Nat, I don’t know what is causing this, but if I had to guess I would say you have some kind of plugin conflict which is preventing the masonery script work it’s magic and position all the posts on the home page. Assuming you are running some plugins I suggest deactivating these. If that ‘fixes’ the problem then you can activate them one by one until the problem re-appears to isolate the plugin causing the issue…then decide if that is worth keeping.

  9. nap beltran says:


    How can i removed the categories, latest post on the home page?

    thank you.

    1. Ryan S says:

      Hi @nap,

      Thanks for using our theme

      Yes it’s in sidebar-home.php file.

      Hope that helps

  10. Scott says:

    Hi Charles-

    Thanks for the very clean and nice theme. I am definitely a dabbler in sites, so appreciate the simplicity of customizing it. I can see where I can link my social profiles on the site, but do not see any social sharing links for the posts, etc. Can you let me know if I have missed something or recommend a good plug in or other way to enable people to share content–which is key way I need to build my audience? Thanks in advance and thanks again for a great theme.

    1. charles Charles says:

      Hi Scott, the theme doesn’t come with built in social share buttons, but there are loads of great plugins which add this. We use the Floating Social Bar plugin on this site, and also developed our own plugin which adds social share buttons though it is very very simple and doesn’t have all the configuration options of others like Floating Social Share Bar.

  11. Mario says:

    Hi. I love your “Surfarama” theme, and i’ve it on many website i menage. There’s a way that I can translate for you the template in italian, and you include it in the future release? Thanks

    1. charles Charles says:

      Hi Mario, thanks for the offer of translating the theme into Italian. I’d be happy to make it available here for users to download (and give you credit). Cheers, Charles.

      1. Mario says:

        Could you tell me which file contain the text to translate, and I provider to start work immediately? thanks

        1. Ryan S says:

          Hi @mario,

          Thanks for using our theme

          It’s the .mo and .po file, mostly under /languages/HERE

          Hope that helps

  12. Wayne says:


    How can I increase the widget widths on the full page layout? Widget widths on the side bar are wide enough for a trip advisor widget but when adding it to the widget boxes along the bottom of the page the trip advisor widget is to wide and overlaps the borders.

    1. charles Charles says:

      Hi Wayne, this would require some template customization which goes beyond the level of support we can provide here in the comments. If you need professional help with this please email us at [email protected] and we can provide an estimate.

  13. Nathan says:

    Hi guys,

    Great theme, how can I limit the number of posts on the front page but get them all to show up on a category page?


    1. Ryan S says:

      Hi @nathan,

      Thanks for using our theme

      We’ve already provide solution on this, you can follow comment thread in

      Hope that helps

    2. Wayne says:

      I still have not sussed this one out

  14. J.Sandoval says:

    I really like this template, but ¿how could I show the Home page as a simple list of posts (with right widgets) instead of the actual format? Thank you in advance.

    1. J.Sandoval says:

      Even just having the possibility of showing the widgets at the right side at Home page would be nice.

      1. Ryan S says:

        See my reply on your previous comment, also duplicate single.php or page.php as your base file on creating page template, in that you already have right sidebar ready.

    2. Ryan S says:

      Hi @J.Sandoval

      Thanks for using our theme

      This take a bit of time but here’s how to do it
      1. Create page template with custom query code in it
      2. Create Empty page and select the page template you’ve just created in step 1
      3. Use the page you’ve created in step in Settings -> Reading -> Frontpage

      Hope that helps

  15. ipunk says:

    What is the purpose of “BOOKMARK THE permalink” link in every post?

    I dont think readers really care about this nor use this feature.

    Sure, I can manually remove this by myself but i find this annoying to remove it again and again after new updates.

    1. charles Charles says:

      You can save the trouble of changing again after update by setting up your theme as a Child theme.

  16. Nathanael Pribady says:

    Why I must click ‘view full site’ to activate Surfarama themes in my phone? I’m using Nokia Lumia, when i opened it using my friends phone (Sony and Lenovo) in their phone must click ‘view full site’ too, please help me Charles thank you 🙂

    1. charles Charles says:

      Hi Nathanael, works fine for me on my HTC One. I’m guessing you realized you were using a plugin which automatically generated a mobile version of the site? The theme is responsive so not mobile plugin required.

      1. Nathanael Pribady says:

        I only use 4 plugins: Akismet, Jetpack, WordPress SEO and Favicon Rotator, which one i should deactivate? thanks again sir 🙂

        1. charles Charles says:

          The only one of those that might impact this is Jetpack…I can’t recall if Jetpack does anything with mobile. Try deactivating that temporarily and if that works then you can check and see which of the bundled features in Jetpack is impacting mobile and try to deactivate that element.

  17. Lara says:


    I’ve tried everything but can’t get the “posted in” category line under the post.

    Please help. Here’s my blog

    1. Lara says:

      I’m using the WPML multilingual plugin, maybe that’s the problem?

      1. Ryan S says:

        Added a reply on your first comment

    2. Ryan S says:

      Hi @Lara,

      Thanks for using our theme

      I’ve visited your site and it works fine? can you send us screenshot explaining why it’s not working?, thanks

      1. Lara says:

        Hi Ryan,

        Now is OK. I’ve just added the featured image in one post and after that the category line appeared in all posts.

        Thanks anyway!

  18. Wayne P says:


    How can I stop author name and published date appearing at the top of posts?

    1. Ryan S says:

      Hi @wayne

      Thanks for using our theme

      The easiest solution is by using CSS, .entry-meta{ display: none; }

      If you didn’t child theme you can use this plugin and put your code in there

      Hope that helps

  19. Trevor says:

    Hi! Thanks so much for the amazing free theme. It really punches up the image-focused work I do.

    While the responsive theme works great for the homepage and individual posts, I have problems with the header. It doesn’t rescale on smaller screens; it just crops it to the width of the screen.

    Any way to correct this? Is there a place in the theme I should be changing the header width from an absolute value to a %?

    1. Ryan S says:

      Hi @trevor,

      Thanks for using our theme

      I guess you’re using logo image, try this instead #site-logo img{ width: 100%; }

      Hope that helps

  20. manu says:

    Is it possible to control the size of the post in home page, currently latest post is big and others are small. Is it possible i can make other posts also as big as the latest one.

    In general i want to control the size of posts in home page

    1. Ryan S says:

      See previous comment

  21. manu says:

    Hello team,

    I like your theme a lot, the only last issue i am stuck with is i want the size of home page posts to be flexible. Currently the latest post is bigger one and rest all is small. But what i want is ability to make few of the other posts to be as big as the last post.

    1. Ryan S says:

      Hi @manu,

      Thanks for using our theme

      If you want something that you can control font-size in Dashboard or Theme settings, unfortunately that requires much of time and there’s nothing we can do here at comment support, contact our support at [email protected] to discuss more, thanks

  22. Brandon says:

    Awesome theme. How can I get the text at the top like you have where you say “This site is a demo…”

    Also is the gallery built in or did you use a plugin for that?

    1. charles Charles says:

      Hi Brandon, there is an alt_homepage template which looks just like the default home page, but will display your page content at the top just like our demo. What do you mean by gallery? The home page is just showing latest posts arranged in a masonery format. If that’s what you mean then yes that is all part of the template no plugin required.

  23. Giulietta says:

    Sorry for disturbing, but I would like to know how I can change the social media icons with customized icons. Thank you!

    1. Ryan S says:

      Hi @Giulietta,

      Thanks for using our theme

      You can simply replace all icons under library/images/.

      Hope that helps

  24. Tim says:

    Hi there,

    Featured images are not showing in the single page posts. I’ve tried turning all plugins off and reloading the theme. I’ve changed themes also and the featured image shows in the posts fine. I’ve also checked the functions.php file and can’t see anything wrong in there. Is it an error due to the WP update?

    1. charles Charles says:

      Hi Tim, this is by design. Featured images don’t (and never have) been part of the single posts template. This is a purposeful design choice. We use the featured image for the home and archive pages, but we leave the single posts free so users can choose how and when to add their own images. If adds a step if you do want to use the featured image in the post, but gives you more flexibility.

  25. Rakesh says:


    I’m using surfarama, When I create category pages, it only shows 1 post in the category and not any other posts in the second category. I’m not sure why this is happening?

    There was this other problem where widgets in the category page collided with the grid of category posts. I fixed it by editing the category template and by moving the Get_Sidebar function out of the div, just before the get_Footer function.

    Still help me out with why the loop in the category pages template isn’t working?


    1. Ryan S says:

      Hi @rakesh,

      Thanks for using our theme

      You don’t need to create Category page, I think you’ve added page or posts instead of posts category, it works perfectly fine in demo and in my local so this is something in your end for you.

      Make sure you’ve created posts category first then next create posts and assigned it to associated category, you then choose the created posts category to display in sidebar or in menu.

      Hope that helps

  26. Tom says:

    I am using Surfarama for the blog of our site. Thank You for this great theme. I would like to know how I can shift the location of the sidebar a bit more towards the right.

    1. charles Charles says:

      Hi Tm, can you be more specific? The sidebar is on the far right of the design so not sure what you mean.

      1. Tom says:

        Hi Charles, what I want is to shift the sidebar bit more to the right.But now, I find myself in a bigger mess. The images and the style elements are missing from my wp pages. Please see help

        1. charles Charles says:

          Tom, I’m afraid I don’t know what you’ve done there. My best suggestion is to reinstall the theme.

  27. Wayne P says:

    Hi, really like the theme but need to control the posts shown on the home page. Can I do this by categorizing them? Can I limit the number of posts shown ?


    1. Ryan S says:

      Hi @Wayne,

      Thanks for using our theme

      Yeah it possible by adding parameter posts_per_page => 10 // where 10 is the number of posts you want to return, we can usequery_posts add wp_reset_query(); function right after whileyou can found more info here

      The file you have to edit is only index.php, if this sounds techie for you then you contact us at [email protected]

      Hope that helps

  28. ipunk says:

    One more Q, How to add 160×600 adsense-banner in the 3rd or 4th post loop in the homepage?

    1. Ryan S says:

      This require you to update the content query and add IF condition a sample tutorial can be found here

      The only file you have to update is content.php, if this sounds techie for you, you can contact us as [email protected]

      Hope that helps

  29. Brook says:

    Great theme guys, thank you so much for making it free.

    How do I centre my logo on the page? I’d have to move the social media buttons down a row. Is that feasible?

    1. Ryan S says:

      Hi @Brook,

      Thanks for using our theme

      The easiest solution is to update #site-heading and #social-media width to 100%

      Hope that helps

  30. Sam S says:

    I’ve modified a bit of this for use with my site, but I cannot figure out how to change the category colors. It probably makes a difference that I installed this theme directly from wordpress theme library.

    1. charles Charles says:

      Hey Sam, you can set the category color on the category edit page.

Comments are closed.