Sunday, June 2, 2013

Generate HTML Hyperlinks Appropriately in Live journal

WordPressmakesiteasytoaddlinksinyourcontenttootherpagesonyourwebsiteandtopagesonotherwebsites.However,therearerightandwrongwaystodothings.Therearealsotimeswhenyou'llneedtocreateaHTMLlinkyourselfmanuallysuchasinTextWidgets.Lastly,thereisaLinksManagerbuiltintoWordPressforshowingalistoflinksinyoursidebar.

We'regoingtotakeadeeperlookatcreatinglinksproperlyinWordPress,inallthesesituations.Firstthough,thereissomegeneralinformationaboutHTMLlinksthatappliestoallofyourlinks,regardlessofhowyoucreatethem.Let'scoverthatfirst.

Observe:Usethelinkatthebottomofthisarticletoviewtheoriginalarticleonmyownblogwhichhaslinkstomoreresourcesonacoupleofthetopicsbelow.

SomeGeneralInformationaboutHTMLLinks

TheLinkText.

TheactualtextofthelinkyoucreateisreferredtoastheIn .LinkTextIn ..Forinstance,ifwehadalinkthatsaysIn .clickhereIn .thentheLinkTextforthatlinkisalsoIn .clickhereIn ..Notethatit'smuchbetterforusersandSearchEnginesifyouusesomethingmoredescriptiveforthelinktex tinsteadofgenerictermslikeIn .clickhereIn ..Besuretoincludethekeywordsforthepageyouarelinkingtoaswell.ThishelpsyougetmoreSEO(SearchEngineOptimization)valueforyourpages.

TheLinkTarget.

Youcansetwhetheralinkshouldopeninthesamebrowserwindowwherethelinkisdisplayed,ortohavethebrowseropenawholenewwindowforthelinked-topage.Thegeneralbestpracticeistoalwaystousethesamewindowforanypageownyourownwebsiteandtouseanewwindowforanypagethatgoesoutsideyourwebsite.Thiswayyouaren'topeningnewwindowsneedlesslyandyoumakesureyoursitestaysupafterthepersonclickedonthelink.Youdon'twantthemaccidentlyclosingyourwebsitethinkingtheywerejustclosingthepageyoulinkedto!

TheLinkTitle.

ThistextyouuseastheLinkTitlewilldisplaywhenauserhoversoveryourlink.ThisattributeisusefuliftheLinkTextdoesn'tgivemuchspecificinformationaboutwhatyouarelinkingtoo,In .clickhereIn .forinstance.Ingeneral,it'sbettertousemoredescriptivetermsinyourlinksbuttherearetimeswhenyoumaynotwantto.

AbsoluteorRelative Path.

Therearetwokindsoflinksthatyoucanuse.AnIn .DefiniteIn .linkincludesthefullURLofthepageyouarelinkingto,includingthename.ItisnecessarytouseAbsolutelinkswhereyouarelinkingtosomeoneelse'swebsite,whichyouprobablyalreadyknew.

YoucanalsouseIn .RelativeIn .linkstopagesonyourownsite.Theselinksletyoucreateyourlinkrelativetothelocationofthecurrentpage.Forinstance,ifyouhadapageatIn .Andmy-webpagesAndthis-is-my-pageAndandwerelinkingtoapageatAndmy-webpagesAndthis-is-my-page-2And,youcouldsimplyuseIn .this-is-my-page-2In .astheLinkURL.

YoucanalsouseIn ...AndIn .infrontofalinkURLwhenthelinked-topageisinahigherdirectorythanthecurrentpage.Forinstance,ifyouarelinkingfromAndmy-webpagesAndthis-is-my-pageAndtoAndan additional-pageAnd.ThatURLwouldbelikeIn ...Andan additional-pageAndIn ..Youcanaddasmanyoftheseasnecessaryi.elizabeth.In ...And..And..Andsome-other-pageAndIn ..

UsingRelativelinksarebeneficialonyourownsiteastheywon'tnecessarilyhavetobeupdatedifpartofthedirectorystructurechanges.Forexample,ifyouchangedtheparentpageintheexampleabovetoIn .my-older-webpagesIn .thenyouwouldhavetoupdateanAbsolutelinkwhereasarelativelinkwouldnotneedtobeupdated.

TestYourLinks!Besuretotestallyourlinks!Makeita pointtoclickeverysinglelinkyoucreatetomakesureyougotitright.It'sprettyembarrassingtopointsomeonetoaURLthatdoesn'texist.

CreatingLinksinWordPressContent

Thiscouldn'tbeeasier.YoujustselectthetextinyourpagesorpostsandclicktheIn .PlaceAndeditlinkIn .key(hoveroverthebuttonstoseetheirnames).Thiswillbringupadialogueboxwithacoupleoptionsforyoutofillin.SeetheGeneralInformationaboveformoreinformationabouteachofthosefields.TheLinkTitlewillautomaticallybetheLinkTextofthelinkifyoudon'tentersomethingdifferentintheLinkTitlebox.YoureallyonlyneedtouseitwhenyouwanttheTitletobesomethingdifferentthanthetextavisitorclicksontofollowthelink.

YouarealsogivenanselectaCSSIn .CategoryIn .whichwillchangesomeaspectsofthelinkssuchasformattingandpositioning,dependingonyourtheme.Youcanexperimentwiththoseclassestoseetheeffectitwillhaveonyourparticularwebsite.Mosttimesyouwon'tneedtoselectaclass.

YoucanalsocreatelinksfromyourimagesinWordPressusingasimilarmethod.Insteadofselectingthetex ttogeneratethelinkyouwillsimplyclickonyourimagefirst.Youfollowthesamestepsfromthere.Notethatyoumaygetacolored'border'aroundtheimageonyourpage.Toeliminatethis,edityourimageandgotoAdvancedSettingsandsetenterIn .In .intotheborderproperty.

TheWordPressLinkManagerWordPressalsohasabuilt-infeaturetodisplayalistoflinksinaWidgetwhichyoucanaccessviatheLinkstabinyourAdminCenter.Here,youcaneasilyaddAndchangeAnddeletenewlinks,includingputtingthemintocategories,selectingiftheyshouldopeninanewwindowornot,for example.Youcanevenaddimagestothemifyou'dlike.YoucanthendisplaytheselinksusingtheLinksWidgetbygoingtoAppearance>WidgetsjustlikeanyotherWidget.

CreatingLinksManuallyTheremaybetimeswhenyouneedtocreatetheHTMLcodeforalinkmanually.Forinstance,youwanttocreateaTextWidgetinyoursidebarthathasalinkit.You'llhavetocreatetheHTMLforthelinkbyhandinthesecases,butfearnot,it'snottoohard.Atypicaltextlinkwilllooksomethinglikethis...

(Ican'tuseHTMLhere,seetheoriginalarticlebyclickingbelo wforanexample)

Youcancopyandpastethisdirectlyintowhereeveryouneedit(usetheHTMLtabifeditingapageorpost)andreplacesomeofthetexttotheparticularsofyourlink.You'llreplaceeverythingbetweenthequotesfortheIn .hrefIn .section,whichisthelinkURL,andtheIn .titleIn .section.You'llthenneedtoreplacethetextofIn .ClickHereIn .towhateveryouwantyourlinktexttobe.Justbesuretotrythelinkouttomakesureitworksproperly.

Alrighty,that'saboutallthereistoknowaboutcreatinglinksinWordPress.IhopethatwillhelpyoucreateyourownlinksproperlyinWordPresswhereeveryoumayneedthem.Nowgocreatesomegreatcontenttolinkto!



Wordpress Premium Theme

No comments:

Post a Comment