=== Tiny Framework === Contributors: TomasM Requires at least: WordPress 4.1 Tested up to: WordPress 4.6 Version: 2.2.1 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: one-column, two-columns, right-sidebar, custom-background, custom-header, custom-logo, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, footer-widgets, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, accessibility-ready, blog, e-commerce, education Theme URI: http://mtomas.com/1/ Author: Tomas Mackevicius Author URI: http://mtomas.com Donate link: http://mtomas.com/about-me/ Copyright: Tomas Mackevicius (see Copyright section below for more details) == Description == Tiny Framework WordPress theme was created with the future in mind and encompasses all the best features of the default WordPress themes in one place, adds full accessibility and Structured Data Markup with Schema.org microdata format support. Fast start is ensured with very extensive documentation! Tiny Framework features elegant responsive mobile-first design, HTML5 ready structure of Underscores, custom per-post headers, custom logo, three footer widgets, FontAwesome icon webfont and Google Fonts support. Web developers will enjoy integrated Theme Hook Alliance custom action hooks. It's all there, you have everything in one neat package. Tiny Framework can be used as a learning tool or your own little web development "framework" a.k.a. "starter theme". With its unique "Coding Tips System" Tiny Framework helps to understand how to extend parent themes and build your own child themes, hacking them the way you want. Along with the main theme you will find an example of a child theme - an easy way to start developing with child themes! You get the best coding examples from default WordPress themes and the best hacks from the child theme. For more information about Tiny Framework please go to http://mtomas.com/1/ To support future development of this theme you can contribute directly by donating with PayPal (if you prefer, you can visit PayPal.com directly and send a payment to services@mtomas.com): https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=CYA7XMLU8ENS2&lc=US&item_name=Free-WordPress-themes-by-TomasM¤cy_code=USD&bn=PP%2dDonationsBF%3abtn_donateCC_LG%2egif%3aNonHosted == Installation == 1. In your admin panel, go to Appearance -> Themes and click the 'Add New' button. 2. Type in Tiny Framework in the search form and press the 'Enter' key on your keyboard. 3. Click on the 'Activate' button to use your new theme right away. 4. Go to http://mtomas.com/389/tiny-forge-framework-child-themes-comprehensive-guide for a guide on how to customize this theme. 5. Navigate to Appearance > Customize in your admin panel and customize to taste. Support ======= WordPress.org - free, but very limited support forum, that deals only with the issues of existing theme code: https://wordpress.org/support/theme/tiny-framework Need personalized (paid) support? If you need a help extending or modifying this theme, you can always contact me for a commercial support: http://mtomas.com/wordpress-theme-support-consultation/ Tomas Mackevicius - http://mtomas.com - services@mtomas.com - @TomasMack Overview of main theme features =============================== - Elegant, readable and fully responsive theme built on HTML5 and mobile-first layout. - Provides full web accessibility: conforms to WAI-ARIA (Web Accessibility Initiative - Accessible Rich Internet Applications) and WCAG 2.0 AA (Web Content Accessibility Guidelines) requirements. - Integrated Structured Data Markup with Schema.org microdata format support - good for Google index and rank building. Required for Google Rich Snippets, Breadcrumbs and Sitelinks Search Box. Structured Data Markup can be easily tweaked/adjusted in functions.php file - most important settings in one place! - SEO optimized - only one H1 heading per page on any page! Optimized for Google PageSpeed Insights score and Google Mobile-Friendly Test. Theme doesn't generate its own post/page titles, that makes it compatible with plugins like Yoast WordPress SEO. - Performance optimized - additional scripts are loaded in the footer, option to load icon webfont via CDN. - Custom Headers for posts and pages (including random header rotator), 3 footer widgets, integrated Social Menu to display your networking links in the footer. - Custom logo to display it next to Site Title and Description. - Styling for post formats on both index and single views. - An optional "Open Sans" display font (enabled by default) and Google Fonts support (optional). - Icon webfont support - using Font Awesome webfont icons. - Integrated Theme Hook Alliance custom action hooks. - Front page template with its own widgets. - Full-width (no-sidebar) page template. - Page template to display a list of links (blogroll). Blogroll feature is available as a plugin: Link Manager. - Included a starter child theme - easy way to make it your own! - Compatible with popular plugins: Jetpack (Infinite scroll, Sharing). - LESS dynamic stylesheet language support! Welcome to rapid development age - change the look and feel of your site in minutes! (provided via child themes). Full overview of Tiny Framework theme ------------------------------------- http://mtomas.com/1/ Quick start guide ================= 1. The way WordPress works, each time you update a theme, its folder would be overwritten with new version. That means if you want to make changes to the theme and retain them, you have two choices: use a custom CSS plugin, where you would store all new CSS styles, or use a child theme, that you would modify. First choice is good for users who will do only small changes, that can be achieved by modifying CSS styles. In this case you would append new CSS styles with the help of a plugin. If you're using popular Jetpack plugin suite, it has a Custom CSS module, other plugins to consider: https://wordpress.org/plugins/simple-custom-css/ https://wordpress.org/plugins/imporved-simpler-css/ With the arrival of new theme version, you could update theme, because all your custom CSS styles would be safely stored in the database. If you plan to make more considerable changes to the theme, I would suggest using a child theme. New WordPress users do not know how to create a child theme, for that purpose I included an example of a child theme with main Tiny Framework download under inc/examples/tiny-framework-child. To install child theme, upload this child theme as a separate theme alongside with Tiny Framework parent theme (both themes should be uploaded for child theme to work). Activate Child theme and you're ready to go! From that point all of your changes will be done in the child theme. If you need to modify a file, but it isn't present in your child theme's folder, just copy it there from the Tiny Framework theme. As a bonus, Tiny Framework child theme has very nice search field in the top menu area (ported from Twenty Thirteen theme), support for Overhanging/Pull Quotes and Overhanging Images. Two new header images were added to give you an example on how to change the default header images in the child theme. To activate search field you have to create a menu and assign it as primary (see Step 3). Read more about child themes: https://codex.wordpress.org/Child_Themes 2. In WordPress Admin panel go to Admin Panel Menu > Appearance > Widgets, expand Footer Copyright Widget Area on the right side, drag a standard Text widget from the left side to the widget area, enter your copyright text in the text field (leave the title field empty): ` © 2015 Your Name. All rights reserved ` P.S. please do not copy backticks - they are here to make this document compatible with Markdown syntax. 3. Go to Theme Customizer (Admin Panel Menu > Appearance > Customize) and see if you need to change any visual aspects of your site. - If you already created menu, assign it as primary in Navigation. You can also create a menu and assign it as primary in: Admin. panel > Appearance > Menus At the top see: "Select a menu to edit, or create a new menu." and create a menu if it's a fresh WordPress install. Then at the bottom check "Theme locations: Primary Menu" and save the menu. - If you will choose to upload custom logo (display it next to Site Title and Description), I recommend to size its height to 85px. 4. Setup menu for social icons. First method (an easy one) is to create new menu, name it "Social" or other name and assign it as "Social Links Menu" (the check box at the bottom). Then you can add your social profiles as Links. By default social icons would be displayed on the right side of the footer. If you want to use icon webfont for social networks in widgets and other places, use standard text widget in the Main Sidebar Widget (same instructions as with Footer Copyright Widget) with text like this: ``` Contact me Facebook LinkedIn WordPress.org Twitter Github ``` P.S. please do not copy backticks - they are here to make this document compatible with Markdown syntax. 5. Next, open functions.php file in a text editor and find sections: - 6.0 (2.2 in child themes) - Add optional meta tags, scripts to head - 9.0 (1.4 in child themes) - Footer credits - Tip87 - Action Hook implementation example - 10.0 (3.0 in child themes) - Functions to optimize performance - 11.0 (4.0 in child themes) - Functions to increase security - 12.0 (5.0 in child themes) - Other functions Check if you need to enable (uncomment) any of the functions there. If you enabled human.txt meta tag, open human.txt file in text editor and update it with your information. 6. Make it look clean (optional). Personally I'm not a fan of displaying a bunch of meta data on index page or on archive pages. I try to keep it as clean as possible to not mess with readers attention. But I had to enable all that meta info to pass theme evaluation. However it is very easy to fix it. To disable entry meta, located below the post in index/archive view, open style.css file in a text editor and search for Tip30, then uncomment next CSS block to hide entry meta section (with author, categories, tags) in the Index page and archive listings. 7. If you want to use custom logo, there are two usage cases: - Your self-hosted site runs WordPress 4.5 or newer version or site is hosted at WordPress.com. - If you have self-hosted site that runs older WordPress version, you have to install Jetpack plugin. Then go to Customizer and under Site Title & Tagline you can upload an image to use it as custom logo. 8. Maintain fully accessible website (recommended). As you probably noticed, accessible WordPress themes have special "accessibility-ready" tag. It basically means that this theme produces accessible website on clean WordPress installation. It also means, that after some user actions website might not be fully accessible anymore. That's right, website owners can negatively affect accessibility of their own websites. Here are several precautions and tips to keep your website accessible. - Headings play a big role in providing web accessibility and can have potential impact for website's SEO ( https://www.joedolson.com/2014/11/headings-hierarchy-problem/ ). Knowing that, users should use headings in their produced content following main heading structure of a theme. H1 is reserved to describe one most important item on a page, usually post/page title. H2 is used to outline main website document structure and H3 is used to describe less important page elements, like widgets, etc. Tiny Framework users should use headings in posts and pages starting from H2, and starting from H4 for the content inside the widgets. - Use headings in a consistent manner, don't skip or mix them up, eg. H2-->H3-->H4, but not H2-->H4-->H3. Basically, you have to start with highest heading (H2 for content and H4 for widgets) and then use lower importance headings if needed. If you would think that visually lower importance heading, eg. H4 looks better, you would not use H4 after H2, but instead you would alter the CSS style of H3 to match your needs. This would give you the desired look and would not break the logical structure of a document. - If you will decide to change color and/or background of text elements, always check if new color combination conforms to web accessibility requirements: http://webaim.org/resources/contrastchecker/ This requirement is also valid for the states of a text or link: :hover, :focus, :active, :visited. - If you upload images that add value to the content, please do not forget to provide Title description and/or Alt Text description in media uploader. If Alt Text field of media uploader is empty, WordPress will use Title field instead. So at least one of the fields should be provided. For more information please see - How to use Tiny Framework and its child themes: a comprehensive guide: http://mtomas.com/389/tiny-forge-framework-child-themes-comprehensive-guide Theme document structure ======================== This might help you when applying CSS rules to see the "Cascades" of Cascading Style Sheets. Example for single.php ---------------------- >