Thank you for buying Alfa! We have spent a very long time developing this theme and the framework which it is built upon. We’ve done our very best to make it as extensive and feature-rich as possible, while also keeping it incredibly easy and slick to use. We’ve also worked hard to improve the ease of customisation.
We would happily welcome feedback from you on how, if anywhere, you would like this documentation improved. If you would find anything a little bit easier and more helpful if we went into more detail, or explained something a little better – we’d be happy to hear it. We want Cutting Edge to be the best theme on the market! If you have any comments, please mail us via the form on http://www.themeforest.net/user/Spyropress.
To help you better understand the theme, and for walkthroughs of certain aspects of Cutting Edge, please check out our tutorial videos:
Video TutorialsThis theme requires a working version of WordPress to already be installed on your server. If you need to install WordPress then please visit: http://wordpress.org/download/. If you need any help with the installation, please refer to the guide below:
Installing WordPressHere is a brief step by step on how to install WordPress:
Note: If your FTP client has an option to convert file names to lower case, make sure it’s disabled.
You can download the latest version of your theme files from Themeforest.
The easiest way to install your theme is to upload via the WP Dashboard:
If you have FTP login details, you can upload the un-zipped file to the correct folder on your site.
Right after the theme was activated, a notification at the top of the screen will suggest to continue with the installation of the plugins that come packed into the theme. You can also access this page by going to Spyropress » Install Plugins.
The fastest and easiest way to import our demo content is to use our Theme Options Demo Content Importer. Our importer will give you all pages and posts, widgets, theme options, assigned pages, and more. This is recommended to do on fresh installs because it will replace your current theme options and widgets and other settings. So the best time to use the importer, is when you first install Spyropress Theme. To import our demo content, please see the steps below.
WP Super Cache is a plugin for WordPress that generates static HTML pages from your dynamic WordPress blog. Once static pages are generated, those pages are displayed to visitors, using less server resources than dynamic webpages.
For busy websites running WordPress, we recommends that a caching plugin, such as WP Super Cache be enabled. This will allow your website to handle more simultaneous visitors and also typically loads much faster than without the caching plugin.
Please complete all four steps to use the suggested settings.
On “Advanced” tab When selecting between “Use mod_rewrite to serve cache files” and “304 Not Modified browser caching” please note that 304 Not Modified browser caching will not be selectable as long as you have Use mod_rewrite in use. You will need to use one or the other as recent updates to the WP Super Cache Plugin have made the use of both un-accessible at this time.
Then, scroll down and select “Update Mod_Rewrite Rules” in the yellow box.
Scroll down to “Expiry Time & Garbage Collection” and enter “3600″ in the box, then select “Change Expiration”
It is recommended that you do not remove the default user agents from the list, to prevent bots from caching content and pages not normally seen by your visitors.
Cache hits to this website…
Enables caching
Use mod_rewrite to serve cache files
Fastest caching method, uses mod_rewrite rules in client’s .htaccess file
Compress Pages
Super Cache files are compressed and stored that way so the heavy compression is done only once. These files are generally much smaller and are sent to a visitor’s browser much more quickly than uncompressed html. As a result, the server spends less time talking over the network which saves CPU time and bandwidth, and can also serve the next request much more quickly.
304 Not Modified browser caching
Indicates to the client’s browser whether a requested file has been modified or not (see: http://www.addedbytes.com/for-beginners/http-status-codes/ or elsewhere for more info on that apache code)
Don’t cache pages for known users
This prevents logged-in users from being served cached pages and is the default for almost every caching plugin out there.
Expiry Time & Garbage Collection
The default setting will allow cache files to age 1 hour (3600 seconds) prior to being removed which is ideal. This setting can be increased for sites that do not have many posts (1,000 or less ) if you do not update your content often. If you have a very large amount of posts ( 25,000+ ), a lower setting around 1800 may be more viable to prevent stat/CPU issues due to the amount of files being created.
Rejected User Agents
It is recommended that you do not remove the default user agents from the list, to prevent bots from caching content and pages not normally seen by your visitors. (For example, if you have a calendar, a real visitor may only browse months close to now, but a bot will index every month forever as if it is a different page. Caching these pages real visitors are unlikely to visit wastes resources.)
Alfa is 100% translation and multi-lingual ready, and we recommend that you use the very popular WPML plugin.
To translate the static strings, if you aren’t using WPML then I recommend downloading PO Edit, from http://www.poedit.net/. Once you have installed please follow the steps below:
If you translate Alfa into a language that isn’t included, then we’d really appreciate it if you could send it to us. This will benefit you as you won’t have to re-upload it when you update the theme, and will also help out others. If you want to contact us about this, please use the form provided on the page here:
Contact UsYou can change the theme’s logo by accessing the Theme Options and uploading your logo with the uploader.
You’ll want to upload an image to use for the favicon too. The favicon should be 16×16 in pixels.
You may want users to be able to add your web application or webpage link to the Home screen of their iPhone, iPad or Andriod, represented by an icon. Upload icons in Theme Options to represent your web application or webpage.
To setup the home and blog page, navigate to Settings » Reading, select “A static page” and choose your “Home” page as the Front page and “Blog” page as the Posts page.
Watch the Creating a static front page for your blog video from WordPress.tv.
To start adding posts to your blog, navigate to Posts » Add New.
Once you’re on the Add New Post screen:
Since creating and editing pages is basic WordPress knowledge, we won’t cover it in detail. If you’re new to WordPress, you may find the following resources valuable: How to Create a new Post How to Edit and Existing Post Using Categories and Tags
Buckets are reusable piece of content, which can be placed in the middle of another content area or even inside another bucket.
To start adding buckets, navigate to Buckets » Add New.
Once you’re on the Add New Bucket screen:
Bucket shortcode can be used to display specific bucket into a post, page, widget or custom post types.
[bucket id="" /]
Portfolio let you showcase your work beautifully in the Alfa, to start adding portfolio items, navigate to Portfolios » Add New.
Once you’re on the Add New Portfolio Item screen, you will then be able to set a title for the portfolio item, add the body content, and also provide all the meta information such as extra details and media.
You Must set this image, this is the Cover Image
You can upload and add several images as Portfolio Previews. These images will be used in the slider area of the Portfolio Detail Page.
You can add/choose categories for each portfolio item. . Portfolio categories will be used to filter through the portfolio in the filtering system.
You can also set the Live Preview URL of the item and you can also add testimonials to that item, so your user can know what your client thinks about your work.
Now we assume that you have added several portfolio items, lets display your portfolio items on the HomePage.
Gallery show your images or videos through Gallery manager in an effective way.
To start adding galleries, navigate to Galleries » Add New.
Once you’re on the Add New Gallery screen:
To enable the use of Twitter widgets/modules/assets within Alfa, you will need to create your own Twitter Application and then generate access tokens and secrets for use.
To create your own Twitter Application, follow these steps:
Once you have created your Twitter Application you will need to generate an Access Token and Secret.
We have provided a child theme package ready for you to use if you wish to make changes to files, while keeping them through updates. The child theme is included within the main download folder, all you need to do is upload this as well as the standard “Alfa” folder, and then activate the child theme in Appearance » Themes from the WordPress menu.
We’ve include the child theme css file ready for you to add your own styles, if you’d prefer to do it here rather than in the custom css box within the theme options. If you are adding styles here, but aren’t seeing them on the front end, try adding !important to the end of the declaration. This is sometimes needed to override the dynamic css styles that are generated from the theme options customisations.
We’ve also included a child theme functions.php file, which you can use to add your own php functions, or override functions from the parent theme.
Alfa featured an amazingly powerful and beautiful Theme Options where you can find all the theme settings. The theme options can be used to customise the theme to suit your needs, including backgrounds, layouts and much more. You should take the time to go through all of these options to ensure that you are getting the most out of the theme.
All, theme options are self-explanatory or are described well directly in admin panel. The theme options is divided into the categories to make them easy to find.
You can export and save your theme settings and later import them back in Appearance » Options Export/Import section. Please read the available options description for more info on how to export or import theme settings.
Alfa featured an amazingly powerful and beautiful Fullscreen Slider where you can add unlimited slides.
Spyropress Brings the revolutionary Drag-and-Drop Builder. Create elegant and complex layouts through our advanced visual interface. Be free to add anything in any place you want and be in control of everything.
It is backed by Modules comes with Developer API to let you create unlimited modules according to your need. The Modules API is similar to the WordPress Widget API, so easy to learn nothing new.
Yes! Now you can use your favorite widgets, shortcodes, wordpress sidebars and wordpress menus while building your content using the SpyroBuilder, build freely whatever you want.
Coming Soon
Alfa includes 15 Modules, that you can use with The SpyroBuilder to create the page layout as you want.
Blog – display your latest post with this module.
Bucket – display any bucket which you have created for re-using of content.
Contact Info – display your contact information such as address, phone, email, etc and your timing as well.
Divider – separate your website sections easily.
Gallery – gallery builder let you create a gallery in the website.
Google Map – embed a google map with zoom option.
Heading – create heading into the page layout wherever needed.
Icon Teaser – display brief text with a link and icon.
Our Team – let you display your staff with their name and photos.
Parallax Area – create parallax node into the page layout wherever needed.
Recent Portfolio – let you display your latest work in elegant grid way.
Rich Text – provides a WYSIWYG editor to create rich text content into page.
Service List – let you display your services in a elegant column way.
Skills – display your set of skills in beautiful progress bars.
Testimonials – list your clientèle testimonials.
assets/css/skeleton.css - Sleek, intuitive, and powerful front-end framework for faster and easier web development.. More info: Skeleton Grid
assets/css/custom.css - Its a blank css file used to have custom styling if required and you can override it in Child Theme.
assets/css/jquery.fancybox.css - fancybox lightbox skin used in the theme.
assets/css/layout.css - The main css for the theme, which includes the layout and styling for all aspects of the theme.
assets/js/app.js - this is where all the custom magic happens. Feel free to edit any of this code, but make sure to keep a backup in case anything goes wrong!
assets/js/bigvideo.js - a jQuery Plugin for Big Background Video (and Images)
assets/js/easing-min.js - a jQuery plugin from GSGD to give advanced easing options. You can find out more here: http://gsgd.co.uk/sandbox/jquery/easing/
assets/js/gmaps.js - a jQuery plugin for integrating Google Maps easily. You can find out more here: http://hpneo.github.com/gmaps/
assets/js/jquery.cbpFWSlider.min.js - a jQuery plugin for Fullscreen Slideshow of images. You can find out more here: http://tympanus.net/codrops/2013/02/26/full-width-image-slider/
assets/js/jquery.cycle.all.js - a plugin used to cycle images
assets/js/jquery.fancybox.js - a jQuery plugin for lightbox. You can find out more here: http://fancyapps.com/fancybox/
assets/js/jquery.imagesloaded.min.js - a plugin used to detect when images have been loaded
assets/js/jquery.isotope.min.js - an exquisite jQuery plugin for magical layouts. You can find out more here: http://isotope.metafizzy.co
assets/js/jquery.lettering.js - a jQuery plugin for radical web typography
assets/js/jquery.localscroll-1.2.7-min.js - makes animated scrolling navigation, using anchors
assets/js/jquery.nicescroll.min.js - a jquery plugin, for nice scrollbars with a very similar ios/mobile style
assets/js/jquery.parallax-1.1.3.js - a plugin used to turn nodes into parallax effect
assets/js/jquery.quovolver.js - a jQuery plugin for Rotating Quotes
assets/js/jquery.sticky.js - makes an element on the page stick on the screen as you scroll
assets/js/modernizr.custom.js - is a JavaScript library that detects HTML5 and CSS3 features in the user’s browser. You can find more here: http://modernizr.com/
assets/js/jquery-ui-1.8.22.custom.min.js - official jQuery user interface library