Senna - User Guide

byPixelGrade
shared on wplocker.com
User Guide
Table of Contents
1.ThemeOptions 1.1GeneralOptions 1.2StyleOptions 1.3HeaderOptions 1.4FooterOptions 1.5HomePage 1.6ContactPage 1.7PortfolioOptions 1.8BlogOptions 1.9SocialandSEOOptions 2.TheHomepageSlider 2.1AddingSlides 2.2OrdertheSlides 3.Custommenus 4.Shortcodes 4.1Columns 4.2Teammember 4.3Icon 4.4Glossary 4.5Circle 4.6Button 5.Customwidgets 5.1FlickrPhotostream 5.2DribbblePhotostream 5.3LatestPosts 5.4SocialLinks 5.5Newsletter 6.ThePortfolio
1. Theme Options
1.1 General Options
HereyouwillfindthegeneraloptionsfortheSennatheme.
Enableordisablethesmoothscrolling(theApplestylescrolling)foraprofessionallooking website. Setupthesitelogo(bothnormalandRetinasizedlogoimage2x),thefavicon,theApple iconandtheMetroicon.YoucanalsoenteryourGoogleAnalyticstrackingcode. 3
1.2 Style Options

Hereyoucanplaywiththestylingoptionstheweprovide. Changetheoverallaccentcolorwithabuiltincolorpickerandadjustthecolortomatch yourlogoorcompanycolor.
Youcanalsochangethedefault,includedfont,withoneofthe600+GoogleWebFonts, withainstantlivepreviewoftheselectedfont. IfyouneedtomakesomeminorCSSchangestothesite,youcanusetheCustomCSS 4
StyleboxtoaddthenecessaryCSSoverwriterules.Formoreadvancedchanges,we recommendthatyoueditthe.scssfilesorhireadeveloper.Youcanalsoaddcustom javascriptcodethatwillbeaddedtoyour<head>section.
1.3 Header Options
Fromhereyoucanchoosewhethertheheaderportionshouldstayfixed(floatontopofthe contentandremainatthetopofthescreen),orshoulditbeanormalheaderthat disappearswhenyouscrolldown.
1.4 Footer Options

Fromthissectionyoucancontrol thesitewideCalltoActionsection block,andedititscontents,button andlink.Youcanalsodefinethe copyrighttext.
1.5 Home Page

Thissectionoffersyouthecontrols forthehomepage.
Youcanchoosewhetherornotto displaytheparallaxanimatedslider, editthecontentbelowthatslider (theprimarycontentarea),choosewhetherornottodisplaythelatest3portfolioprojects, andeditthecontentbelowtheportfoliolatestprojects(thesecondarycontentarea).
1.6 Contact Page

Hereyouhavetheoptionsto managethecontactpage information.
Youcanchoosewhetherornot todisplayaGooglemapof yourlocation,andinputthe neededmaplink,editthe contactinformation,editthe pagecontentontheleft,the pagetitleandchoosethe previouslycreatedContact Form7contactform.
1.7 Portfolio Options

Inthissectionyoucanportfoliopage(thearchivefortheprojects)titleandheaderimage (werecommenduploadinganimageofatleast1200pxwidesincethiswillbeafullwidth image).
Youalsohaveadvancedcustomposttypecontrolstodefinethesingularandplural,change theslugfortheprojectandportfolio,andalsowhetherornotyouwanttousetagsforyour projects.
1.8 Blog Options
Inthissectionyoucontrolthelookof yourblogarchiveandsinglearticle pages.Youcanchoosetheheader imagethatwillbeshownbehindthe blogarchivepages,choosefrom3 differentlayoutsforyourarchives(full widthwithoutsidebar,sidebarleftand content,andsidebarrightandcontent). Youcanalsochoosewhetherornotto showthearticlefeaturedimagesonthe blogarchivesandchangetheword countforthearchivearticleexcerpts. 8
Thesamelayoutoptionsforthesinglearticlelayout(fullwidth,sidebarrightandsidebar left).
1.9 Social and SEO Options
Thissectionisdedicatedtothesocial andSEOoptimizationofyoursite.You canchoosewhetherornottoletusadd thesocialmetatagsthatthesearch engineandsharebuttonssolove.We willneedfromyou,foreachsocial service,Facebook,GoogleandTwitter, someinforegardingpublishers,app IDsthatcontrolthesocialpresenceof thewebsite,profileURL.The explanationsprovidedforeachfieldare prettyclear.
Inthissection,youcanalsoplaywiththesocialiconsthatwillbeusedforthecustomSocial Iconswidget.Inputyoursociallinksandordertheiconswithdrag&drop.
2. The Homepage Slider
Yourbeautifulfrontpagecomesintegratedwithafullwidth sliderwithniceanimatedtext,smoothtransitionsand parallaxscrolling.Allyouneedtodoisaddslidesfromthe leftsidemenusectionHomepageSlider.
2.1 Adding Slides

Simplyaddnewslideslikeyouwoulddowithposts.Foryourcomfort,wevemadea custominterfaceforadding/editingslidesallowingyoutoenterallthedatanecessaryfor youslidestorock.
10
UploadorselectandexistingbackgroundimageintheImagesectionusingtheWordpress MediaUploader. AddtheslidercontentintheContentsectionusingtheWordpresseditor.Youcanhaveas littleasah1titleoryoucanuseourPixelGradeShortcodesplugintoaddcolumns, icons,andmuchmore.Theremaining2inputsallowyoutosetthebuttontextandthelinkof thebutton.Allthiscontentwillappearabovethebackgroundimage,withnicetransition animations.
11
2.2 Order the Slides

Toorderthehomepageslides,youneedgointotheedit mode,orusetheQuickeditfeature,andassignanorder numbertoeachslide.
3. Custom menus
Sennawilladd2custommenuzones uponactivation,allowingyoutouse theWordpressmenueditortocontrol thenicelyintegratedmenusatthetop andfooter.
GotoAppearance>Menus,and create2menus,oneastheheader menu(youcanhavemultiplelevels) andoneasthefootermenu(onlyone level).Afterthatassigneacheach menutotherespectivelocation,inthe leftsidesectionThemeLocations.
4. Shortcodes
Hereiswherethebeautylies.Wevetakenthat extramileandcraftedanadvancedbutsimpleto useshortcodespluginthatwillallowyoutogive structureandblingtoyourpagesandposts.To ensureeaseofuse,everythingisvisual,nicely packedinamodalwindowaccessiblefromthe Wordpresseditor.LookforthatfunkyPbutton.
12
4.1 Columns
Themainshortcodethatwillbetheworkhorseofyourpages,istheColumnsshortcode. Thisenablesyoutodividethecontentintoamultitudeofcolumnsviaasimpleandintuitive sliderinterface.Simplychoosehowmanycolumnsdoyouwantandthendragtheslidersto selecttheproportionsofeachcolumn.Togetthatmuchneedededge,youcanadda customcolortothebackgroundoftherowofcolumns(hexadecimalcolorcode)andmake thebackgroundextendtothefullwidthofthescreen. Onceyouaredone,hittheInsertbuttonandwewillgenerateforyoutheshortcode,with somedummycontentforeachcolumn.Fromhereyoucanaddwhatcontentyoudesirein eachcolumn,text,imagesorevenothershortcodes.
13
Youcanhavemultiplerowsofcolumnsinonepage,withdifferentcolumnconfigurations, butweurgeyoutotakethetimeandthinkthingsover,soyoudontclutteryourpageswith toomuchcomplexity.JustaheadsuptokeepSennaworkinginyourfavour:)
4.2 Team member

Thisshortcodehelpsyouaddteammember informationinastructuredway,likeyoucansee atthebottomoftheAboutpage.Yousimplyadd theName,Title,Descriptionandanimageand youaregoodtogo.Ifyouoryourteammembers aresociallyengaged(whoisnotthesedays)you canalsoaddthelinkstothemainsocialnetworks: Twitter,Facebook,LinkedInandPinterest. 14
4.3 Icon
Becauseiconsarecool,wevemadeit easyforyoutoaddiconsusingthefamous FontAwesomeicons.Wealsoallowyou choosebetween2backgroundstyles(a rectangleorcircle)and3sizes(small, mediumandlarge).Allthesesoyoucan bettermakeyourpoint.
4.4 Glossary
Usingthisshortcodeyoucanaddaglossaryattheendofyourpagesorposts,witha customstyledtitle,linkandleftorrightaligned.SimplyinputtheTitle,Link,Contentand Alignment.YoucanalsoinputaCSSclasstoallowyoutocustomstyletheglossary.
4.5 Circle
Tomakeyourpointaboutcertainkeyaspectsofyourvision,youcanusetheCircle shortcodetoaddawordenclosedinnicelystyledcircle.Maybeatthetopofyourcolumns definedusingtheColumnshortcode?
4.6 Button
15
Tofurtheremphasizeyourcalltoactionorlinks,youcanusethisButtonshortcodetogeta beautifulbuttonthatisinlinewiththerestofthetheme(wereallyhatethosepeskydefault browserbuttons).Simplyinputthebuttonlinkandlabelandyouaregoodtogo.Youcan alsochoosethesizeofyourbutton:small,mediumorbig.Forcustomstylingyoucanadda CSSclassand/orid.
5. Custom widgets
Tohelpyoufurthercustomizeyoursidebarsandfooterwevecomeupwithaseriesof customcodedwidgetsthatintegratebeautifullywithyourSennatheme.Youcanfindthe widgetsandthesidebarsintheAppearance>Widgetssectionoftheleftsidemenu.
5.1 Flickr Photostream
Usethiswidget(calledSennaFlickrWidget)toaddthelatestphotosfromausersstream oraFlickrRSSfeed.Youcansetthewidgettitle,usernameorRSSurl,tags(tofilterthe streamtocertaintopics)andthenumberofimagestodisplay(werecommendtokeepthis numbershort,somewherebetween8and12themaximumallowedis20).
5.2 Dribbble Photostream

Usethiswidget(calledSennaDribbbleWidget)toaddthelatestphotosfromausers Dribbbleaccount.Youcansetthewidgettitle,theDribbbleusernameandthenumberof imagestodisplay(werecommendtokeepthisnumbershort,somewherebetween8and 12themaximumallowedis20). 16
5.3 Latest Posts

Usethiswidget(calledSennaLatestPosts)todisplayinyoursidebarorfooterthelatest blogposts,thefirsthavingbesidesthetitlelink,ashortexcerpt.YoucaninputtheTitleof thewidgetandthenumberofposts.
5.4 Social Links

Thisisaverysimpletousewidget(calledSennaSocialLinks).Itsimplydisplaysthesocial linksyouvepreviouslysetupintheSennaThemeOptions,usingourcustomdesigned socialicons.YoujustneedtotellittheTitleandyouredone.
5.5 Newsletter
6. The Portfolio
Usethiswidgettogetacustomstylednewsletterform.
Letusgivesomeinformationabouthowtheportfoliogridbasedpatchworkstylegalleryis settowork.Keepingupthemainidea,wevedecidedthatwewillmakeiteasyforyou.For eachproject(youcanadd/editnewonesintheleftsidemenuitemProjects)youjusthave toaddyourcontent,uploadtheimages(werecommendatleast700pxwideimages)and, thisisimportant,tosettheFeaturedimage.Thiswillbetheimagethatwillbeusedasthe bigimageonthehomepage,portfoliopage,andtheprojectpage.
17
Therestoftheimageswillbechosenbasedontheiraspectratiobecausewe(andyouwe think)wanttocropaslittleaspossiblefromyourcarefullymadepictures.Soforeach smallerimagewetrytofindsuitablecandidates.Ifyouhaventuploadedenoughimages toaproject(weneedatleast45dependingofthepositionoftheprojectinthegalleryso ifyouuploadmorethan5youwillbecovered)wewillfillthatpositionwiththesiteaccent color,definedintheThemeOptions>StyleOptions. Ontheprojectpage,weonlycropthebigimage,therestbeingshrunktofitthegrid,sono croppingthere.
18

Senna - User Guide

Загружено:

Сведения о документе

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Senna - User Guide

Загружено:

Авторское право:

Доступные форматы

byPixelGrade

Enableordisablethesmoothscrolling(theApplestylescrolling)foraprofessionallooking website. Setupthesitelogo(bothnormalandRetinasizedlogoimage2x),thefavicon,theApple iconandtheMetroicon.YoucanalsoenteryourGoogleAnalyticstrackingcode. 3

1.2 Style Options

Youcanalsochangethedefault,includedfont,withoneofthe600+GoogleWebFonts, withainstantlivepreviewoftheselectedfont. IfyouneedtomakesomeminorCSSchangestothesite,youcanusetheCustomCSS 4

StyleboxtoaddthenecessaryCSSoverwriterules.Formoreadvancedchanges,we recommendthatyoueditthe.scssfilesorhireadeveloper.Youcanalsoaddcustom javascriptcodethatwillbeaddedtoyour<head>section.

1.3 Header Options

1.4 Footer Options

1.5 Home Page

Youcanchoosewhetherornotto displaytheparallaxanimatedslider, editthecontentbelowthatslider (theprimarycontentarea),choosewhetherornottodisplaythelatest3portfolioprojects, andeditthecontentbelowtheportfoliolatestprojects(thesecondarycontentarea).

1.6 Contact Page

1.7 Portfolio Options

Youalsohaveadvancedcustomposttypecontrolstodefinethesingularandplural,change theslugfortheprojectandportfolio,andalsowhetherornotyouwanttousetagsforyour projects.

2.1 Adding Slides

2.2 Order the Slides

4.2 Team member

5.1 Flickr Photostream

5.2 Dribbble Photostream

5.3 Latest Posts

5.4 Social Links

Вам также может понравиться