146 lines
6 KiB
Text
146 lines
6 KiB
Text
|
=== Affinity ===
|
|||
|
|
|||
|
Contributors: automattic
|
|||
|
Requires at least: 4.3
|
|||
|
Tested up to: 4.6.1
|
|||
|
License: GPLv2 or later
|
|||
|
License URI: http://www.gnu.org/licenses/gpl-2.0.html
|
|||
|
|
|||
|
|
|||
|
== Description ==
|
|||
|
|
|||
|
Affinity is a classic one-page theme designed with weddings and family announcements in mind.
|
|||
|
|
|||
|
|
|||
|
== Installation ==
|
|||
|
|
|||
|
1. In your admin panel, go to Appearance > Themes and click the Add New affinity.
|
|||
|
2. Click Upload and Choose File, then select the theme's .zip file. Click Install Now.
|
|||
|
3. Click Activate to use your new theme right away.
|
|||
|
|
|||
|
|
|||
|
== Setting Up Your Front Page ==
|
|||
|
|
|||
|
When you first activate Affinity, your homepage displays posts in a traditional blog format. To set up your homepage, follow these steps:
|
|||
|
|
|||
|
1) Create a page.
|
|||
|
2) Go to the Customizer’s Static Front Page panel and set “Front page displays” to “A static page.”
|
|||
|
3) Select the page created in Step One as “Front page,” and choose another page as “Posts page” to display your blog posts.
|
|||
|
|
|||
|
Good news! This theme doesn’t need a front-page template — set a static page as your front page, and you’re good to go. On its own, the page displays a single panel with a full-screen featured image, your site logo, description, and navigation, and your page content.
|
|||
|
|
|||
|
To get your site set up, you’ll want to add some more panels.
|
|||
|
|
|||
|
== Adding Panels ==
|
|||
|
|
|||
|
Each “panel” is a standard page. To add additional panels to your Front Page, follow these steps:
|
|||
|
|
|||
|
1) Create or edit a page.
|
|||
|
2) Navigate to Customize → Theme Options. From the drop-down, select the page you’d like to appear in the panel.
|
|||
|
|
|||
|
== Panel setup in the Customizer ==
|
|||
|
|
|||
|
To set the background image of your panel, assign a Featured Image to the page.
|
|||
|
|
|||
|
Click on the diamond-shaped links to navigate through the front-page panels, or adjust the opacity of the Featured Images from Customize → Theme Options → General.
|
|||
|
|
|||
|
|
|||
|
== Featured Images ==
|
|||
|
|
|||
|
Affinity supports prominent Featured Images on the blog, and single posts and pages.
|
|||
|
|
|||
|
|
|||
|
== Theme Options ==
|
|||
|
|
|||
|
In addition to the Front Page, you can customize the theme’s behavior under Customize → Theme Options → General.
|
|||
|
|
|||
|
-- Header Image Opacity --
|
|||
|
|
|||
|
Change the opacity of the header image for better contrast with the text.
|
|||
|
|
|||
|
-- Scrolling Featured Images --
|
|||
|
|
|||
|
Uncheck “Allow Featured Images to scroll in the background on large screens” to change the scrolling behavior of the header and front page Featured Images on large screens.
|
|||
|
|
|||
|
Note: The scrolling behavior is not visible in the Customizer for performance reasons, but you’ll see it on the front page of your site.
|
|||
|
|
|||
|
|
|||
|
== Widgets ==
|
|||
|
|
|||
|
Affinity boasts a one-column or two-column layout. Add widgets to the Sidebar area for a traditional two-column blog, or leave it blank for a sleek one-column style. The theme also includes three optional widget areas in the footer
|
|||
|
|
|||
|
Configure these widget areas from Customize → Widgets.
|
|||
|
|
|||
|
|
|||
|
== Page Templates ==
|
|||
|
|
|||
|
Affinity comes with two Page Templates for dressing up your content:
|
|||
|
|
|||
|
-- Full-Width Template --
|
|||
|
|
|||
|
The Full-Width template gives you more space for your content. It’s the perfect way to showcase a large gallery of images or a video.
|
|||
|
|
|||
|
-- Guestbook Template --
|
|||
|
|
|||
|
Designed with weddings in mind, the Guestbook template highlights your visitors’ comments.
|
|||
|
|
|||
|
When using this template on a page, it’s good to double-check that comments are enabled. To do this, edit the page and click on More Options. Under the Discussion header, check Allow Comments and publish.
|
|||
|
|
|||
|
|
|||
|
== Social Links ==
|
|||
|
|
|||
|
Affinity supports a Jetpack Social Links (jetpack.me/) menu, which appears in the footer. Linking to any of the following sites will automatically display its icon in your menu:
|
|||
|
|
|||
|
CodePen Digg
|
|||
|
Dribbble Dropbox
|
|||
|
Facebook Flickr
|
|||
|
github Google+
|
|||
|
Instagram LinkedIn
|
|||
|
Email (mailto: links) Pinterest
|
|||
|
Pocket Polldaddy
|
|||
|
Reddit RSS Feed (urls with /feed/)
|
|||
|
StumbleUpon Tumblr
|
|||
|
Twitter Vimeo
|
|||
|
WordPress YouTube
|
|||
|
|
|||
|
|
|||
|
== Post Intro ==
|
|||
|
|
|||
|
Affinity has a small but nifty intro feature. Also known as a “deck” or “kicker,” the intro area is displayed between the headline and body copy on posts.
|
|||
|
|
|||
|
Your intro provides important information and acts as a link between the title and the rest of your post. A carefully crafted deck grabs readers’ attention, giving them an idea of what to expect in the full post.
|
|||
|
|
|||
|
Add your intro in the Excerpt field of each post, which you’ll find in the More Options area of the Post Editor sidebar.
|
|||
|
|
|||
|
|
|||
|
== Additional Support ==
|
|||
|
|
|||
|
Affinity also supports the following features:
|
|||
|
|
|||
|
* Site Logo
|
|||
|
* Custom Menus
|
|||
|
* Custom Header
|
|||
|
* Custom Backgrounds
|
|||
|
|
|||
|
|
|||
|
== Quick Specs (all measurements in pixels) ==
|
|||
|
|
|||
|
* The main column width is 560 for blog posts and 716 for pages.
|
|||
|
* The main sidebar width is 218.
|
|||
|
* Featured Images are displayed at 720 wide and flexible height on the blog, and at full-screen width with flexible height on single posts and pages.
|
|||
|
* The site logo appears at a maximum width of 800 and height of 300.
|
|||
|
* The custom header appears at full-screen width with flexible height.
|
|||
|
|
|||
|
|
|||
|
== Credits/Licenses ==
|
|||
|
|
|||
|
* Based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc., [GPLv2 or later](https://www.gnu.org/licenses/gpl-2.0.html)
|
|||
|
* normalize.css http://necolas.github.io/normalize.css/, (C) 2012-2016 Nicolas Gallagher and Jonathan Neal, [MIT](http://opensource.org/licenses/MIT)
|
|||
|
* Genericons font by Automattic, http://genericons.com/ (Font: SIL OFL 1.1, CSS: MIT License)
|
|||
|
* Images in screenshot and demo site from http://unsplash.com/, CC0 license (https://unsplash.com/license)
|
|||
|
* Default Header Images:
|
|||
|
-- Typewriter by Sergey Zolkin from https://unsplash.com/photos/E0Spm6XXn2Y, CC0 license (https://unsplash.com/license)
|
|||
|
-- Tulips by Ales Krivec from https://unsplash.com/photos/hLxqYJspAkE, CC0 license (https://unsplash.com/license)
|
|||
|
-- Autumn by Sebastian Unrau from https://unsplash.com/photos/CoD2Q92UaEg, CC0 license (https://unsplash.com/license)
|
|||
|
-- Car by Scott Webb from https://unsplash.com/photos/ivIPed6YAYQ, CC0 license (https://unsplash.com/license)
|
|||
|
-- Camera by Anthony Delanoix from https://unsplash.com/photos/YZzkUW3Tn_g, CC0 license (https://unsplash.com/license)
|