Touchfolio is touch-optimized simple theme created for photographers, designers, architects and artists. It focused on content and providing great user experience on majority of desktop and mobile devices.
Theme Features
- Responsive layout down to mobile.
- Skinning system based on LESS CSS (similar to variables in Twitter Bootstrap). Controls photoshop file included.
- Two types of portfolio - gallery with list in menu and masonry gallery.
- Multiple gallery pages allowed, grouped by category. For example, you can add to menu two pages — "Web" and "Print" with custom list of projects in each.
Gallery
- Super fast native-style touch navigation for supported devices. Swipe left and right to view project images. Swipe up and down to browse projects (powered by RoyalSlider engine).
- Alternatively, use keyboard or mouse wheel on desktop.
- YouTube and Vimeo video support.
- Three types of image scale types — fit to screen if image is larger, fill the screen and no scale (may be different for each album).
- Custom album background color or pattern (may be different for each album).
- Automatically preloads nearby images after current is loaded.
- Unlimited number of galleries and photos per album, within reason, of course.
- Simple and fast gallery management — upload, reorder, remove images.
- SEO optimized, images are indexed by search engines
Blog & Pages
- Nothing special, all default elements, like headings, blockquotes, lists, images, captions are styled.
- Threaded comments support, HTML5 inputs in reply form.
Advanced
- Browser support: modern browsers, IE7+. Mobile: iOS, Android 2.2+, Opera Mobile (haven't tested in all versions), Windows Phone 7+, Blackberry OS and even black and white Kindle Keyboard.
- Hardware-accelerated CSS3 transitions with fallback (supports Firefox 10+ 3d transform).
- Does not block zoom gesture on mobile devices.
- Built with LESS CSS, processed and cached by wp-less.
- Gallery API - documented public methods, callbacks, properties. Gallery can be resized and placed anywhere you want.
- Gallery keeps only 5 images in browser at once time to save memory on weak mobile devices.
- CSS files are merged, all controls are loaded using one sprite to minify http requests.
- Works great with WP super cache.
- Fully translatable and localizable, .po file included.
License
How to install this theme
Touchfolio theme installs to WordPress like any other theme.
Styling theme
Theme CSS file is generated automatically by wp-less plugin (shipped with Touchfolio). Main less css file is style-touchfolio-default.less. It's located in root folder of theme (wp-content/themes/touchfolio/). CSS is compiled (and cached) automatically by server when changes happen in main less file, or when WP_DEBUG is enabled.
General styles, like font colors, font sizes, margins, logo position can be changed in main less file (you don't need to edit anything else).
To edit theme styles and remain theme updatable you need:
- Make a copy and rename style-touchfolio-default.less file.
- Go to Touchfolio options page and in general settings enter name of your file in "Skin File" input field.
If you don't want to use WP-LESS CSS for some reason, you need to copy compiled CSS from live website and paste it in style.css. Then go to functions.php and change USE_LESS_CSS variable to false - define( 'USE_LESS_CSS', false );.
