Instructions


F8 is a child theme for the Modularity theme framework for Wordpress. You must have Modularity installed in your Theme folder in Wordpress for F8 to work correctly. So, if this page looks ugly and doesn't have any formatting, than you don't have Modularity installed.

The theme design was developed with users who appreciate visual browsing and prefer a minimal layout, with their photos and multimedia featured front and center. But, the theme can been used to create everything from e-commerce sites, music review sites, portfolio sites, and everything in between. Homepage designs can be turned on and off at the click of a button on the Theme Options panel. Subscribe to Graph Paper Press' feed or follow us on the bleeding edge of development by following us on Twitter.

Here is a brief list of the major features:

Best Practices

If you want to make changes to how this theme looks and feels, than create a child theme. Never make changes to the original theme files. Why? Because when a new version of this theme is released, all of your changes will be lost when you update. Plus, making a child theme is incredibly easy. Here is how you do it.


  1. Installation

    1. Unzip the folder contained in the archive to your computer
    2. Upload the folder and its contents to the themes directory of your blog, located in "wp-content/themes" where WordPress is installed.
    3. Change the permissions (aka CHMOD) to the /cache/ folder to 777. This folder is used to store your custom post thumbnails (more on this later).
    4. Click on Appearance - Themes menu from the WP admin panel, then select the theme to activate.
    5. Click on View Site at the top of the page. Bam. Hot site!
  2. Special instructions for F8

    F8 comes packaged with two category archive designs. The default design contains a three column thumbnail grid. The template file that produces this design is archive.php. There is an additional file, named category-1.php, which is a basic tubular blog archive listing. If your blog category has a category ID of 1, you don't need to rename the file. If, however, your blog or news category has an ID of, say 3, you would need to rename the category-1.php file to category-3.php. Simple as that. Feel free to copy the file and rename it appropriately if you have multiple categories that require a tubular archive listing. Not sure how to find your category ID? Please read this.

  3. Initial setup

    Modularity is a 950px wide, one or two column theme, depending on options you have chosen. We need to set up your default image and thumbnail sizes to allow for easy posting and consistent design structure. Click Settings - Media and set your thumbnail size to 150px wide by 150px tall for Modularity, Modslider and High-Def. For Modfolio and F8, set your thumbnail size to 310px wide by 150px tall. Set your medium size images to 590px wide and 590px tall. Set your large size images to 950px wide and 950px tall. Post thumbnails are generated automatically by the functions contained in this theme. By default, the theme pulls in the latest image uploaded to the post. There is no need to use custom fields for adding post thumbnails. Simply upload your images using Wordpress' new Add Media button, write a caption and description and click save. While the theme will pull in the thumbnail automatically, it will not add the medium or large sized image to your post automatically. For that, just click the insert image button just as you normally would. If you need additional instructions on uploading photos, inserting photo galleries and using the Wordpress interface, please view this screencast.

  4. Media settings

    1. In Wordpress, click on Media Settings. Set your thumbnails to 150 x 150. Set your medium photo size to 590. Set your large size to 950.
    2. This theme will automatically create thumbnails from the images that you upload. By default, the thumbnail size is 150 x 150. This can be easily changed, if you know a little bit of CSS.
    3. If you plan on self-hosting your own video to use the theme's built-in HD video player, you need to use the Post Thumbnail text field on the Write Post panel and paste the URL to your video thumbnail. The dimensions of the thumbnail should exactly match the dimensions of the video dimensions that you plug into the Post Video Options panel.
  5. Theme Options

    This theme has seven optional homepage designs:

    1. Slideshow Section - A full page slideshow
    2. HD Video Section - A full page video presentation
    3. Featured Sliding Posts - A horizontal slider that reveals six featured posts
    4. Thumbnail Slider - A horizontal list of thumbnails representing recent posts
    5. Featured Section - A main post at left, with three earlier posts at right
    6. Blog Section- A normal tubular list of posts
    7. Five Categories Section - A five column grid of selected categories

    Please activate each option and view your new homepage design. Remember, less is more.

  6. Navigation

    The navigation contains a listing of all your pages and posts, your contact info and the search bar. You can set or remove the contact info from the Theme Options panel. To add/remove pages from the listing, please see these instructions. To add/remove specific categories from the listing, please see these instructions.

  7. Video

    Modularity has a built-in HD video player that plays FLV video files. You are no longer restricted to pixelated YouTube videos. To add a video, upload the FLV file to your server using your favorite method, like FTP. Copy and paste the link to the file into a custom field called "video". Next, add a video thumbnail. You can do this the exact way that you add regular thumbnails, except, you will want to add an image large enough to fit the maximum size of the video player. Add the video thumbnail to a custom field with key value "video-thumb". You can also add other multimedia, which can include virtually any media with embed capabilities. Enter "multimedia" as the key value and paste your YouTube, Vimeo, or any other html embed code into the value field. You can read more about using custom fields here.

  8. Thumbnails

    By default, TimThumb, a script that auto crops and auto generates thumbnails regardless of what size you set in the Media options, is turned on. This is recommended if you just switched from a different theme which used a different media setting (such as Modfolio in our case). We have experienced that most hosting servers do not allow this script to run by default. But they generally allow the script to run if you request them. Alternately, you can disable this script totally from the Modularity Options page. Go to Thumbnails and uncheck Turn On Auto Thumbnails option. If you want to know more about TimThumb, please visit this website.

  9. Widgets

    There are a total of three widgetized areas on this theme, depending on which options you activate on the Theme Options panel. Three widgetized areas appear on the bottom and there is one sidebar widget. You can add and delete widgets by clicking Design - Widgets, from within your Wordpress admin panel.

  10. Advertising

    This theme has two built-in spots for advertising: One in the sidebar, which measures 310 pixels wide, and one underneath the main post, which measures 590 pixels wide. You can add your adversing code on the Theme Options panel.

  11. Common problems

    This theme uses jQuery javascript to do lots of fancy stuff. If your theme looks broken, than you likely have a plugin that uses a conflicting javascript library. Deactivate your plugins, one-by-one, to determine which plugin is conflicting with jQuery.

    Still having trouble? Consider becoming a member of Graph Paper Press so you can get access to our private, well-groomed support forum, tutorials, and additional themes.

  12. Recommended plugins

    • Shadowbox JS: Lightbox plugin for photos currently in use on the demo site.
    • WP Super Cache: This plugin generates static html files from your dynamic WordPress blog. After a html file is generated your webserver will serve that file instead of processing the comparatively heavier and more expensive WordPress PHP scripts.
  13. Credits

  14. License Details

    There are a few things to know that you can and cannot do with this theme:

    • Give credit where credit is due. Keeping the credit link intact is recommended. If you want to remove the credit, consider becoming a developer-level member of Graph Paper Press.
    • You may use this product for personal and commercial purposes.
    • DO NOT resell or redistribute this product in whole or part (including derivative works).

    This theme was created for by us for you. Inquiries, comments, suggestions: info@graphpaperpress.com