WordPress Portfolio Plugin

WordPressPlugin:SlimpackPortfolio
TheSlimpackplugingivesyoumostofthemodulesfoundintheJetpackplugin,
butyoudonotneedtocreateaWordPress.comaccountinordertouseit.
TheSimpackpluginPortfolioCustomContentTypeisjustoneofthemodules
includedwiththeSlimpackplugin.Theseinstructionsfocusoninstallingandusing
theSlimpackpluginPortfolioCustomContentType.
InstallingSlimpackPlugin
1. IntheWordPressDashboard,clickPlugins.
2. FromthePluginsarea,selectAddNew.
3. IntheAddPluginspage,gototheSearchPluginsfieldandenterSlimpack.
4. TheSlimpack–LightweightJetpackpluginwillappear.ClickInstallNow.
5. Thepluginwillinstallonyourserverspace.ClickActivatePlugin.
ActivatingSlimpackPortfolioCustomContentType
1. IntheWordPressDashboard,clickSettings.
2. FromtheSettingssubmenu,selectSlimpack.
3. InthelistofActiveJetpackModules,selecttheCustomContentTypes
checkbox.
4. ScrolldownandclickSaveChanges.
EnablingPortfolioCustomContentType
1. IntheWordPressDashboard,clickSettings.
2. FromtheSettingssubmenu,selectWriting.
3. ScrolltothebottomoftheWritingSettingspage.
4. UnderYourCustomContentTypes,clicktheEnablePortfolioProjectsfor
thissitecheckbox.
5. ClicktheSaveChangesbuttonatthebottomofthepage.Portfoliowill
appearasaCustomContentTypeintheDashboard.
CreatingPortfolioProjectType
Thisstepisoptional,butitishighlyrecommended.CreatingProjectTypeswillgive
yougreatercontroloverthelayoutofyourProjects.Asyou’llseelater,youcanuse
ProjectTypeswiththe[portfolio]shortcodethataddsyourPortfoliotoyoursite.
1. IntheDashboard,clickPortfolio.
2. FromthePortfoliosubmenu,selectProjectTypes.
3. IntheProjectTypespage,giveyourProjectTypeanameandslug.(Note:A
slugcontainsonlylowercaselettersornumbers.Aslugdoesnotcontain
spaces.Useahyphentoseparatewordsand/ornumbers.Slugslook-likethis.)
4. ScrolldownandclickAddNewProjectType.
CreatingaPortfolioProject
1. IntheDashboard,clickPortfolio.
2. FromthePortfoliosubmenu,selectAddNew.
3. GiveyourProjectaname.
4. UsingtheEditor,addtext,images,video,audio,etc.toyourProject(justas
youwouldwhilecreatingaPageorPost.)
5. Ontheright,underProjectTypes,selectaProjectTypeforyourProject.
6. ScrolldowntotheFeaturedImagesection.ClickSetfeaturedimage.
UploadorselectanimageinyourMediaLibrary.(Note:Makesureit’sa
largeimage—itwillbecroppedbyyourtheme.)
7. ClickSetfeaturedimage.
8. Whenfinished,clickPublishorUpdate.
CreatingaPortfolioPage
1. IntheDashboard,clickPages.
2. FromthePagessubmenu,selectAddNew.
3. GiveyourPageatitle.Note:ThePagetitlecanbePortfolio.Theslug,
however,cannotbeportfolio.
4. IfyourPagetitleisPortfolio,youmustchangetheslug.Changetheslugto
portfolio-pageormy-workorwork-examples,etc.
5. YouwillbeusingShortcodetocallyourProjectTypesintothispage.Youcan
leaveitblankfornow.ClickPublish.
AddingShortcodetoPortfolioPage
1. IntheDashboard,selectPages.
2. GotoyourPortfoliopage.
3. IntheVisualeditoraddthefollowingshortcode(besuretoincludeboth
brackets):
[portfolio]
4. Whenfinished,clickUpdate.
5. TheshortcodewilllayoutallofyourPortfolioProjectsinatwo-column
grid.ClickViewPagetoseethedefaultlayoutofyourPortfolioProjects.
UsingShortcodetoCustomizePortfolioLayout
Bydefault,the[portfolio]shortcodewilldisplaywiththefollowingwith
attributes:
• Two-columnlayout
• PortfolioProjectslistedoldesttonewest.(Determinedbydate/time
PortfolioProjectwasaddedtoWordPress.)
• FeaturedImage(TheFeaturedImageofthePortfolioProject)
• Type(ProjectTypelistedifcheckedinPortfolioProject)
• Tag(ProjectTaglistedifaddedinPortfolioProject)
• Content(ExcerptoftextthataccompaniesthePortfolioProject)
Youcanaddattributestothe[portfolio]shortcodetocustomizethelayoutofyour
PortfolioPage.
Tousetheseattributes,addanddefinethemwithinthebracketsofthe[portfolio]
shortcode.Seeexamplebelow.
IMPORTANT:Neverincludeaspaceafteracommawhenworkingwithacommaseparatedlistinthe[portfolio]shortcode.The[portfolio]shortcodemustlook
likethis:
[portfolioinclude_type=iteme-one,item-two]
Noticetheabsenceofaspaceafterthecommaintheexampleabove.Ifyouputa
spaceafterthecomma,the[portfolio]shortcodewon’twork.
Thefollowingattributes,example[portfolio]shortcodeandexamplescreenshot
arefromthePortfolioShotcodepageonWordPress.com:
• display_types:displayProjectTypes.(true/false)
• display_tags:displayProjectTags.(true/false)
• display_content:displayprojectcontent.(true/false)
• include_type:displayspecificProjectTypes.Defaultstoall.(commaseparatedlistofProjectTypeslugs)
• include_tag:displayspecificProjectTags.Defaultstoall.(comma-separated
listofProjectTagslugs)
• columns:numberofcolumnsinshortcode.Defaultsto2.(number,1-6)
• showposts:numberofprojectstodisplay.Defaultstoall.(number)
•
•
order:displayprojectsinascendingordescendingorder.DefaultstoASCfor
sortinginascendingorder,butyoucanreversetheorderbyusingDESCto
displayprojectsindescendingorderinstead.(ASC/DESC)
orderby:sortprojectsbydifferentcriteria,includingauthorname,
projecttitle,andevenrandtodisplayinarandomorder.Defaultstosorting
bydate.(author,date,title,rand)
Example[portfolio]shortcode
[portfoliodisplay_types=truedisplay_tags=falseinclude_type=ui-design,app-design
columns=3showposts=10orderby=title]
Theexamplewilldisplayuptotenportfolioprojectsinthreecolumns,inascending
alphabeticalorderbyprojecttitle.ItwilldisplayProjectTypes,hideProjectTags,
andonlydisplayprojectsthatareassignedthe“UIDesign”or“AppDesign”Project
Types.
ExampleoftheshortcodeintheEspiedtheme