documentation_v16.txt


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}

body {
font: normal 12px/22px Arial, Helvetica, sans-serif;
color: #333;
margin: 0 auto;
padding: 30px 10px;
max-width: 960px;
}
h1 {
font-size: 50px;
font-weight: bold;
line-height: 1.2;
letter-spacing: -1.5px;
margin-bottom: 25px;
}
h2 {
font-size: 28px;
font-weight: bold;
line-height: 1.2;
margin: 18px 0;
}
h3 {
font-size: 24px;
line-height: 1.2;
margin: 32px 0 18px;
}
h2 + h3 {
margin-top: 18px;
}
h4 {
font-size: 20px;
line-height: 1.2;
margin: 18px 0;
}
p {
margin: 18px 0;
}
a {
color: #0099ff;;
text-decoration: underline;
}
a:hover {
color: #ff6600;;
}
em {
font-style: italic;
}
strong {
font-weight: bold;
}
img {
margin-right: 5px;
vertical-align: middle;
}
ul, ol {
margin-left: 20px;
}
ul {
list-style: inside disc;
}
ol {
list-style: inside decimal;
}
hr {
border: none;
border-top: 1px dotted #868686;
margin: 18px 0;
}
pre {
border-left: 3px solid #eee;
background: #f6f6f6;
line-height: 20px;
margin: 18px 0;
padding: 5px 30px;
overflow: auto;
}
code {
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
background: #666;
color: #fff;
font-family: "Lucida Console", Monaco, monospace;
white-space: nowrap;
padding: 3px 3px 2px;
}
pre code {
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
background: none;
color: #333;
white-space: pre;
padding: 0;
}
table {
border-collapse: separate;
border-spacing: 1px;
background: #eee;
}
th, td {
text-align: left;
padding: 4px 8px;
}
th {
background: #f6f6f6;
font-weight: bold;
}
td {
background: #fff;
}



Website - WordPress theme documentation Version: 2.1 Created: 29 December 2012 Website: http://themeforest.net/item/website-responsive-wordpress-theme/1739143/ Demo: http://themes.kubasto.com/website/ Table of contents Introduction Website is a responsive WordPress theme, which means it adapts to the device on which it's presented. Actually, it presents one of 4 generated versions: desktop - for displays wider than 979 px tablet - for displays 740 - 979 px wide mobile - for displays 320 - 739 px wide mini - for displays narrower then 320 px The theme cares for your content so it looks great on all versions, but you can also decide to show part of a content on some versions only, and hide on others (read more about it in chepter 3.9). Website has a lot of features, and most of them are intuitive to use, but if you need a deeper insight, this is the documentation prepared for you. Thanks for buying, and enjoy :) Installation Theme installation FTP method: Upload just the contents of the website folder to the wp-content/themes folder on your server. Activate the theme through the Appearance / Themes menu in WordPress. Open the theme configuration page and set up theme options. Pure WordPress method: Extract package downloaded form ThemeForest, compress just the website folder and upload it using Appreance / Themes / Install Themes uploader. Important note: After activating the theme, please go to Settings / Permalinks and click Save changes. Enjoy your new theme! Importing example content If you wish to have the same content I've created for theme's demo site, you can import XML to your WordPress from the demo_content folder. Use WordPress Importer plugin to do it. Just remember it doesn't affect Theme Options. I don't recommend importing this file on your production site. Just on the test site, if you have one (it's good to have one). Working with the theme Defaults These are default sizes for site elements on the desktop version: full width slider - 940x285px slider + two banners - 620x285px + 300x133px standard post featured image - 188x188px image post type featured image - 650px wide full width page content area - 890px wide content area of a page with sidebar - 650px wide sidebar - 220px wide Some of these sizes above are customizable in Theme Options. Front page Menus Portfolios Galleries Sliders Contact form To create contact form page, select Contact form as a template when you create or edit page. To add contact page to the footer, drag and drop Contact form widget to the Footer sidebar. Full width page/post Create or edit page or post, and in the Options box set Sidebar to None. Shortcodes If you are not familiar with shortcodes, these are extra magic spells to use in text which can for example add a special highlight or text box. You just start with opening shortcode, put some text or other stuff inside and write closing shortcode on the end. Some shortcodes don’t need the closing tag (for example horizontal lines). If you want to learn more how to use shortcodes and watch examples, check them online on the Website demo. There are 9 shortcodes with lots of parameters: Shortcode Parameter Allowed values Default value dropcap, dc hr, line mark, highlight color yellow quote align none, left, right none width [number]px, [number]% 100% icon name address, administrative-docs, advertising, archives... (all filenames from the data/img/icons/16 and data/img/icons/32 folders) size small, big small tooltip, tip title [text] gravity nw, n, ne, w, e, sw, s, se n list icon address, administrative-docs, advertising, archives... (all filenames from the data/img/icons/16 and data/img/icons/32 folders) button type tiny, small, normal, big normal url [url address] target self, parent, top, blank self icon address, administrative-docs, advertising, archives... (all filenames from the data/img/icons/16 and data/img/icons/32 folders) box color green, orange, red, blue, gray blue icon address, administrative-docs, advertising, archives... (all filenames from the data/img/icons/16 and data/img/icons/32 folders) size small, big small column, col width [number]/[number] 1/2 first first, yes, true last last, yes, true tab label [text] first first, yes, true last last, yes, true active active, yes, true media version all, lte-tablet, lte-mobile, lte-mini, gte-desktop, gte-tablet, gte-mobile, desktop, tablet, mobile, mini all visible yes, true, no, false yes type block, inline block You can preview all icons in the data/img/icons folder. You can also add new icons (16x16px and 32x32px) there – they will work the same way as all, just use their name as parameters value. Hiding / showing page content on specific types of devices There are 4 versions of the site - desktop, tablet, mobile and mini. By default all content is the same for all versions. If you want to hide part of a content for some site versions (e.g mobiles), or show just only some versions, use the [media] shortcode described in the chapter above. [media] shortcode has 3 parameters: version - describes type of devices for which you want to show / hide content placed inside the shortcode. Available basic values are: desktop, tablet, mobile, mini. If you want to describe more versions in the same time, you can use the gte- prefix (grater or equal) or lte- (lower or equal). E.g.: lte-mobile defines both mobile and mini versions. gte-mobile defines all versions except mini. visible - defines if you want to hide or show content specified by the version parameter. E.g.: This part of content is visible for everyone. [media version="lte-mobile" visible="false"] This part of content is hidden on mobile devices (which means its visible only on tablet and desktop displays). [/media] or: [media version="tablet" visible="true"] This paragraph is visible on tablet only. [/media] Parameter visible by default is true so in that case you may skip it. Below is an example of using two different contents - one for desktop devices, second for mobiles: [media version="gte-tablet"] Content for tablets and desktops. [/media] [media version="lte-mobile"] Content for mobiles. [/media] And this part of content is visible on all devices. [media] blocks may consist a lot of text, images and even other shortcodes with no limits. Updating theme Theme has an update notifier, so you will be noticed in your admin area if a new version will be released. The best method to update would be: upload all files to your server, replacing the old ones. No data nor settings will be lost (unless you've made some custom changes to the files by yourself before). FAQ Images on my site doesn't appear, why? Make sure the images you want to use are located on the same server as your site (you've uploaded them from a computer to the WordPress Media Library). The script which resamples images to accurate sizes (for responsive features) won't use images from external servers because of security reasons. Make sure the data/cache folder in the theme's folder has 777 permissions. If you don't know how to change it, use this tutorial. If your Media Library files are located in different folder than wp-content/uploads (default), edit file data/php/timthumb-config.php and modify the path in it. My "Go to blog" link directs back to the homepage, why? You need to create a blog page. Create an empty page and select it as a blog page in Settings / Readings / Front page displays / Posts page. How to make a menu item to not be a link? Use the # sign as a custom link URL of the desired menu item in Appearance / Menus. How to set portfolio a frontpage? Create a front-page.php file in the main theme folder, and paste the following code to it: global $wp_query; $wp_query = new WP_Query(array('post_type' => 'portfolio', 'p' => 999)); get_template_part('single-portfolio', 'front-page'); Replace the 999 with your portfolio ID. How to make images in a WordPress gallery the same size? Add the use_wp_thumbs parameter to the gallery shortcode, e.g.: [gallery columns="4" use_wp_thumbs="1"] How to exclude some images from the standard WordPress gallery? Check IDs of the images you want to exclude in the Media Library (move cursor over thumbnail and read the attachment_id parameter from the status bar in your browser). E.g.: http://mydomain.com/wp-admin/media.php?attachment_id=32&action=edit Now edit page (in the HTML editor mode) which contains the gallery and add the exclude parameter to the gallery shortcode with the ID's separated with commas E.g.: [gallery columns="4" exclude="32,40"] After pasting custom code, images doesn't appear or are distorted, why? Probably because of the responsiveness feature, which deals with images special way. So, to fix it, add no-responsive class to all images used in the custom code. For example: <img src="http://domain.com/image.png" class="no-responsive" /> How to open any site in a FancyBox? Add fancybox and iframe classes to the hyperlink linking to the site. Advanced customization Translating theme If you install or set your WordPress in your language, also theme will use this language if it's supported. If you want to add another translation of the theme, below is a short instruction: For translations I recommend Poedit tool. Create a copy of the xx_XX.po file (from languages) and rename it respectively to your language (check proper name here. For example Swiss German would be de_CH.po). Open that file in Poedit, select Catalog / Update from sources, translate, select language and country in Catalog / Settings, save. It seems a little harsh, but this is the proper way. If you need more details, check here. Custom fonts If you want to use a font, which is not listed in Theme Options, upload it in 4 formats (svg, ttf, eot, woff) to the fonts folder inside the theme main folder. All files must have the same name, just different extenstion. You can use generator to prepare such set. Graphics editing There are a lot of layered and sliced Photoshop .psd files prepared for you in the psd folder. Most of them are grouped in theme color versions folders. Advanced settings of the theme Some options, which are not available in Theme Options can be set by defining PHP constants. To do that, create const.php file in the main folder of the theme, and define one of these constants: Constant's name Default value Description WEBSITE_DEBUG false Turns on debugging mode. For example, it cause that developer versions of CSS and JS are attached, and not the minified versions. WEBSITE_ADDITIONAL_SIDEBARS_COUNT 3 Number of additional sidebars. WEBSITE_SOCIAL_WIDGET_SLOT_COUNT 8 Number of slots in the Social media widget. WEBSITE_SCHEME_SWITCHER false Turns on scheme switcher using GET parameter. E.g. http://yourdomain.com/?scheme=dark. Example content of the const.php file: <?php define('WEBSITE_ADDITIONAL_SIDEBARS_COUNT', 5); define('WEBSITE_SOCIAL_WIDGET_SLOT_COUNT', 12); ?> External resources Fancybox FlexSlider html5.js jquery.cookie jQuery Flickr Feed Plugin JSColor masonry MediaElement.js minify PC.DE Bremen icon pack prefixfree Respond.js tipsy tweet! yaselect Video.js WPZOOM Social Networking Icon Set Changelog Website 2.1 added built-in Google webfonts list, if there is problem with getting it from Google server added * for required fields of contact form added option to scale up site on mobiles added force braking too long words removed "old web browser" notice for Internet Explorer 7 (and older) users added mb_strtolower function testing, to avoid errors on some servers other minor changes Website 2.0.1 added option for easy quote's font customization optimized Theme Options panel fixed missing buttons border on hover fixed not displaying Theme Options bug Website 2.0 added options to customize sizes, colors, line heights of fonts added option to display title and any content on the top of portfolios and galleries added option to modify facebook like button width in post's meta (to fit any language version) added advanced options for site background customization replaced JWPlayer with the MediaElements.js shortcodes support in notice box and featured columns more shorcodes besides main content areas are now supported [column] shortcode doesn't need first and last parameters now better radio boxes and checkboxes look in Contact Form 7 plugin forms WordPress 3.5 support fixed JS error in case of just one slider item used on a site fixed wrong displaying form labels bug fixed post meta displaying error if post's URL contained non-alphanumeric signs fixed PinIt button position fixed favicon code (IE support) fixed site crash if no portoflio/galerry items were used bug fixed not displaying featured images in WooCommerce plugin bug many other small improvements and fixes Website 1.6 added support for the WordPress Multilingual Plugin (wpml.org) added support for AdThis plugin added option to filter contact form incoming spam messages (using Akismet plugin) added Posts List widget added LinkedIn social media button added social media icons: Bloglovin and Instagram added option to use sidebar in portfolio items added option to switch off footer added option to switch off Open Graph Protocol and to set default image added option to switch off displaying replies in Twitter widget added option to set WordPress gallery images same proportions added option to open any page using Fancybox improved portfolio and gallery behavior (especially while rescaling web browser window) portfolio item featured content is now hidden if a password was defined for it new tag cloud widget style selected menu item is marked with leading color now custom background is used also for submenu background (only if any repeating method for background is set) time periods between updates checks in now shorter fixed wrong displaying one columned WordPress gallery fixed wrong margin of sticked top menu if it is displayed on mobile version only fixed bug causing page titles not displaying in search results fixed style causing two images side by side placing impossible fixed wrong banner position on tablet version if no tagline specified fixed missing magnifying glass in the search widget used in footer fixed wrong site printing using Internet Explorer 9 browser fixed long tags list look in web browsers using Webkit engine fixed ignoring leading color by tiny button shortcode fixed bug causing portfolio filter not appear if one of portfolio items had no featured image specified many other small improvements and fixes Website 1.5.1 [button] shortcode can now process target parameter also with the "_" sign (e.g.: blank and _blank) fixed wrong processing [caption] shortcode in WordPress 3.4 fixed wrong processing password form of protected posts in WordPress 3.4 Website 1.5 added option to set compression level of resampled images (also independent setting for mobile version) added option to stick footer to bottom added option to open links from slides in a new browser's window added social media icon: Bloglovin improved support of older versions of Firefox browser fixed wrong displaying images inside the [tab] shortcode fixed bug causing not displaying images in the RSS feed fixed Open Graph Protocol issue with non-alphanumerical glyphs fixed bug related to mb_strlen function compatibility fixes for WordPress 3.4 other minor fixes Website 1.4 added option to place video in a slider added new sorting options for gallery images added meta tag description to site's header added new shortcode - quote added option to create unclicable menu items added option to set featured image for pages added default values of theme options displaying better support for foreign custom post types updated Flexslider to version 1.8 updated other minor JS libraries improved CSS of lists fixed not loading image for Pinterest bug other small improvements and fixes Website 1.3 added support for Pinterest service unnecessary JavaScript scripts are no longer added if a page doesn't use them (which means big loading optimization) better Open Graph Protocol support added option to center logo in the header added option to adjust slider height added option to display author box at the end of post added option to disable ad banner in header on mobile versions added new shortcode [icon] added option to open shortcode button URL in new window added option to display links of next / previous posts at the post page added option to display breadcrumbs also in galleries and portfolios post and page titles don't link to themselves any more external images are not processed by TimThumb any more parameter "exclude" in standard WordPress gallery shortcode now works improved gallery and portfolio look in Internet Explorer 8 browser fixed theme miss-function with PHP "eAccelerator" extension installed on a server fixed wrong images sizes generated for different site versions fixed missing translation texts fixed bug causing not displaying page content in some specific cases fixed bug causing image links not open in new window fixed CSS styles of the <code> tag many other small improvements and fixes Website 1.2 added option to disable resampling images using TimThumb library added option to filter front page Posts List by selected category added "stick to top" option for the top menu added option to independent displaying both menus on desktop and mobile versions of a site added option to independent editing content of both menus on desktop and mobile versions of a site added new portfolio item format: standard added deep-linking feature to filtered portfolio added support for different heights of images in one portfolio item slider added new shortcode: tooltip added support for Open Graph protocol added option to disable images border added social media icon: pinterest added support for PHP 5.4.0 updated TimThumb to version 2.8.10 decreased time between theme updates checks shortcodes are now allowed in a custom ad banner code fixed not displaying images on some server configurations bug fixed not responsive logo and some external-hosted elements (e.g. embedded videos) behavior fixed pagination not displaying on posts archive and search results pages bug fixed Twitter widget displaying content even after failed data import fixed portfolio item slider gallery bug causing not all images to display fixed bad spacing of featured columns without any icon fixed bug causing featured content to display in password protected posts many other small improvements and fixes Website 1.1 added Facebook Like Box widget added portfolio option to use both filtering and pagination added option to turn ad banner on and off now excerpt displays on posts list if available improved responsive images system fixed bug causing errors on some configurations with PHP 5.3.x added demo content in XML format for import other small improvements and fixes Website 1.0 first release Thank you for purchasing this theme. If you have further questions don't hesitate to ask. The best way to contact me is the contact form on my profile page. Kuba Sto