Customising OptimizePress 2 Blog Layout

As part of the 2014 Partnership to Success course, we are advised to use OptimizePress 2 as the theme for our blog. OptimizePress 2 is available as a theme or a plugin for an existing theme. For the purposes of the training it is recommended that you use the theme version on a new blog.

One word of caution if you are on the P2S course – do not try this at home kids! All joking aside, I’m serious about that. Especially if you do not know what you are doing with editing files. The last thing you want is to break your blog.

Responsive Web design (RWD) is a Web design approach aimed at crafting sites to provide an optimal viewing experience … across a wide range of devices …
Source: Wikipedia

The first impression you get is that the blog layout is clean and simple. It has a good use of white-space, pleasing typography and, one of the most important features for me, has a responsive layout. However the back-end is fairly primitive in the range of options available. What’s even worse is that OptimizePress 2 does not support the standard child theme feature of WordPress. At first glance, this does look like you are stuck with the default layout with only the ability to change colour, typography and the side which the sidebar is on. For a modern theme this lack of customisability appears to be woeful.

Luckily OptimizePress 2 does have three sub-themes to change the look of your blog. While they are similar in appearance, there is enough distinction between them to give a twist on the base layout. This gives you a hint on how to customise the appearance of your blog.

The Why of Changing OptimizePress 2 Blog Layout

Lets say for example you wanted to modify the layout in minor ways, but this involved editing the core files. As many of you know, editing core theme files is always a no-no. The simple reason is that one day an update will be released which is likely to wipe out your customisations. Because the different layouts are not that dissimilar to each other, it is possible for all blogs using OP2 theme to look pretty much like each other.

Just so you know, the first two customisations made here was to add a breadcrumb for single posts (fantastic for Google SEO) and change the meta (author and comments details) to include the date. I like to see when a blog post was made. This gives you an idea of how active a blog is when you first visit. It also means that you do not comment on a blog which is, for all intents and purposes, abandoned by its creator. I am willing to be proven wrong, but I do not think OptimizePress 2 allows for this.

The How of Customising OptimizePress 2 Blog Layout

To make safe changes to the OP2 blog layout, follow the simple steps outlined below.

Using either a FTP program (Filezilla for example) download the contents of the OP2 provided blog layout you are currently using into a directory on your computer. Change the name of this directory to 4. In your new directory, open up config.php in a text editor like Notepad. Do not use Word or Wordpad – they will add hidden characters to the files and stop them from working. Change the following lines from:

$config['name'] = __('Theme 3', OP_SN);

To:

$config['name'] = __('New Theme Name', OP_SN);

And this from:

$config['description'] = __('Clean full width blog theme for the ultra minimal look', OP_SN);

To:

$config['description'] = __('Your new theme description', OP_SN);

Once this is done, you now need to upload the entire directory to the wpcontent/themes/optimizePressTheme/themes/ directory at your host. In the OptimizePress 2 Blog Settings -> Themes tab, switch your blog to the newly uploaded theme.

That’s pretty much it. You will need to make changes to the files in the directory you downloaded onto your computer and upload them to your host each time. Ohh, and you might need to know what you are changing and how. That’s way beyond this tutorial and into PHP, HTML, CSS & JavaScript programming territory. If you do not know how to program or make changes at the file editing level, I would suggest hiring someone to do it for you.

I hope this helps, and if you have any questions about this process (but not programming your website) please feel free to post below.

21 comments

Skip to comment form

  1. OptimizePress 2 has the theme options in the WordPress admin panel that allows you to change the layout without having to edit the code yourself; the process of going to Blog Settings >> Themes can be done to change the layout without having to mess with any code whatsoever.

    I do like the clean appearance too and your header looks great on this theme; I prefer it over the Flexibility theme even.

    I am unsure about whether I will add the date info to the posts only because sometimes people can discount information posted on an older post just because they judge it to be outdated before they even read it!

    I’m just starting out with the program for 2014, but liking John Thornhill as a mentor too; loving the bite-size chunks each step is broken up into!

  2. Hi Jennifer,

    Thanks for visiting and the tip. I would add, though, that the customisations available are a total of 3. Not much room for personalisation! You can pretty much tell any website which is using OP2 as its theme. For example, I liked the style of option 2, but it did not have dates in the meta display. I don’t like the layout of option 3, but it does have dates.

    Steve at GFX1 did a good job as always! I always liked this clean look, even back when it was the norm to have graphic heavy sites.

    It goes both ways with dates. I have been to sites without dates and it isn’t until you start to dig around that you realise that nothing had been posted for months, sometimes over a year. I’m not saying that the information is no longer relevant, but you wonder if it is worth your time commenting.

    You can “refresh” the date on older posts if the information is still valid to bring them back out of obscurity. This also gives you the opportunity to bring the content bang up to date.

    JTs training is very good! Have only seen up to week 9 of the 2013 course, and I can honestly say you have not seen the best yet – it just gets better.

    Have fun and take care

  3. Hi Fred & Jennifer,
    Something I sussed the other day (it maybe a ‘Doh!’ moment but I never realised). If you go to ‘All Posts’ you can click on the ‘Quick Edit’ on each post & you can edit a whole load of things (without having to go into each post one by one)……& one of the things you can change is the ‘Date Posted’.

    I even wrote a little post about it & have selected it at the bottom.

    At this early stage I would show the date…it shows that it’s all new, recent stuff & that I think counts for a lot. Much further down the line we could update the date & maybe add a few lines to keep the content fresh (rather than rewriting the whole article).
    Cheers!
    Nigel

    1. Hi Nigel,

      Thanks for the comment. Yes, the quick edit feature can save a lot of time when you need to bulk edit posts/pages. Although it does have it’s quirks – for example, you can only ADD posts to a category, you cannot remove posts from a category! Trust me, I tried. I needed to move about 300 posts on another blog from one category to another. Almost ended up doing it one by one. Took the more technical route of editing the table directly. I definitely do not recommend doing that unless you have A) a backup and B) experience with how MySQL and WordPress work.

      I agree about the date – I like seeing the dates on my blog as it almost forces you be more active. But make the choice your own. That’s how you stamp your unique touch to OP2.

      Take care and have fun!
      Fred

  4. ….& yes Fred, I sussed the profile picture….I did it via WordPress….it’s quite clever that you can use different profile pics with different email addresses.

    1. Hi Nigel,

      Thanks for the update and glad you got it working! That feature is quite handy for keeping your online personas separate.

      Take car and have fun
      Fred

  5. Hi Fred

    Shame to see we can’t use a child theme on OP2. In the early days I spent a good bit of time playing about with the basic twentyten theme (yes that far back!). I did think the OP2 theme would have a bit more friendly customization for layout etc. but it appears slightly clunky in that respect.

    For a text editor I find notepad++ quite good and it’s free, it highlights the relevant sections of code in a file, which is very useful for consistency of code and clean layout.

    Andrew

    1. Hi Andrew,

      Thanks for dropping by. I found out that an upgrade of OP2 will remove any and all traces of customisations you make, even if you do what I suggested above. This goes further against the recommended and accepted method of WP themes/child themes and it ain’t funny.

      I’m sticking with using OP2 as a theme to ensure maximum compatibility with the other features, but will be making damn sure I backup the modifications prior to upgrading again!

      Take care and have fun,
      Fred

  6. I can see you are far ahead of me with Optimize Press which reminds me to get stuck so thanks. BTW what is a breadcrumb?
    Looks great and I need to lift my game but too many pressing issues! Glad to see the check-box re spammer as I loathe captcha!

    Regards
    David

    1. Hi David,

      Thanks for dropping by. Don’t worry about the modifying OP2 bits; in fact, don’t do it unless you really know what you are doing! It’s not part of the course and Omar already had something to say about it me mentioning it.

      I come from a WordPress/website development background so that is the comfort zone for me. Product creation and driving traffic? That is way outside my comfort zone. You area seems to be business management (judging by your blog) so you will find that “easier” than myself.

      A breadcrumb is a string of text at the top of the page showing the reader where they are. I would say the bit at the top of my posts, but I just noticed that they are missing atm. Need to fix that!

      Take care and have fun
      Fred

  7. Nice. Time to customize my Optimizepress layout then.

    1. Hi Andy,

      Be very careful about editing any files, change something the wrong way and you could bork the site. Make sure you copy the closest layout you want and make changes in that copy. Don’t forget that OP2 breaks the WordPress standard regarding child themes and that it will delete any changes you make when upgrading.

      As a theme, OP2 isn’t that great. As a Landing/squeeze page generator and membership plugin however it’s pretty good!

      Take care
      Fred

  8. Hi Steven,

    great advice on how to customise the OptimizePress 2 blog layout.

    Although I didn’t do any customisation yet, I used this exact method to at least get rid of the superfluous and empty h1 tag wrapping the blog banner, which bothered me from the early beginning.

    Thanks for sharing and have a great day,
    Torsten

    1. Hi Torsten

      Thanks for visiting. Editing of the OP2 themes is possible, as long as you are very careful. After playing around with a dev setup (pity it takes one of the licenses!) you can make a site running the OP2 theme look nothing like an OP2 site.

      Why go to all that trouble instead of another theme? Well, for maximum compatibility with the Page Builder and Membership plugin. Other themes *may* work but often have little issues not present with the OP2 theme

      Take care and have fun!
      Fred

  9. Hi there
    I wonder if you knew how to set the comment form above the comments.

    In OP1, it was just needed to add a custom code in the comments.php file of OP but it is not working.

    1. Hi Fabrice,

      Thanks for visiting. At the moment, no I don’t unfortunately. But it’s the sort of thing I really like to figure out and it is probably fairly easy to do.

      I’ll take a look at the relevant theme file(s) and let you know once I have figured it out.

      Take care and have fun!
      Fred

      1. I made some test, so you know. And I figured it was possible to change this in the comments.php located in the folder “optimizePressTheme/pages/global/templates”

        I added the code ” comment_form();” in the comments.php file, juste after “<?php"

        Truth is I had two comments forms after that, one before the comments and one after the comments.

        I didn't really get further in my tests because it was ugly when no comment is existing (2 forms, one after the other). So I don't know if it was coming from a plugin or something else in the theme itself. 😉

        1. Hi Fabrice,

          Thanks for the testing. I would be careful editing the core OptimizePress files. I’m going to finish off a couple of changes on other sites, then come back to this.

          You should always use a child theme when editing theme files, as any updates are wiped out otherwise. Unfortunately OP does not follow the recommended WP child theme system and even deletes any files and folders not in the original distribution when updating!

          I have to copy my layout back to the site every time there is an OP2 update. Right pain in the @rse. It’s almost as if they don’t want you to make changes…

          You could add a conditional to your edit so that it only adds the extra comment form if there are any comments, or a specific number of comments.

  10. Hi! Just curious. How did you add breadcrumbs in OP2?

    1. Hi Marlon,

      I use a plugin called SEO by Yoast which has a breadcrumb feature built in. It has a small piece of code you need to add to your page template which provides the breadcrumb. I can do a quick tutorial on it if you want. It’s not that difficult once you have worked out the oddities of OP2.

      Regards,
      Fred

    • Neo on 5th August, 2015 at 04:33
    • Reply

    Hi, a big thank you for share this info.

Leave a Reply

Your email address will not be published.