DRUPAL7MANUAL“Youmaynoticethatthismanualdoesn’tincludeeverything.Pleaseaddtoit!ThereareabundantDrupal7resourcesoutsideofthisdocument–ifIdidn’tincludesomethinghere,someonemorecapableprobablywroteitdownelsewhere.”~Dr.Smith
ByMarianSmith,Ed.D.,AcademicAffairsAnalyst,UNTOfficeoftheProvostforAcademicAffairs,withcontributionsfromTeresaSchofield,UNTStudentAssistant
UniversityofNorthTexas
1
TableofContents1.GettingStarted.........................................................................................................................................2
2.UsefulTerms............................................................................................................................................3
3.SettingWebsiteInformation....................................................................................................................5
3a.FrontPageInformation......................................................................................................................5
3b.FrontPageURL...................................................................................................................................5
3c.PageRedirects....................................................................................................................................5
3d.SearchBar..........................................................................................................................................5
4.CreatingContent......................................................................................................................................7
4a.Setup..................................................................................................................................................7
4b.BasicPage...........................................................................................................................................7
4c.Article.................................................................................................................................................7
4d.Webform............................................................................................................................................7
4e.ContentFormatting............................................................................................................................9
5.Menus.....................................................................................................................................................10
5a.Horizontal(Top)Menu.....................................................................................................................10
5b.Drop-DownMenu............................................................................................................................11
5c.On-PageMenus................................................................................................................................11
6.NivoSlider..............................................................................................................................................15
7.Toggling..................................................................................................................................................17
7a.Setup................................................................................................................................................17
7b.CodeforToggling.............................................................................................................................17
7c.InsertingImagesintoToggledCode/Tables......................................................................................18
8.PageJumps.............................................................................................................................................20
8a.In-PageJumps...................................................................................................................................20
8b.Out-of-pageJumps...........................................................................................................................20
8c.DeletingAnchors/Jumps...................................................................................................................20
9.UserManagement..................................................................................................................................22
9a.GrantingAccess................................................................................................................................22
9b.EditingAccess...................................................................................................................................22
9c.DeletingAccess.................................................................................................................................22
10. OtherResources.............................................................................................................................23
2
1.GettingStartedYouhaveawebsite!Socool.Nowwhat?
Youneedaccess!
Someone(oneofthewebsite’scurrentusers,orwhoevergaveyouthewebsite)willhavetosetyouupwithauseraccount.MakesuretheyuseyourUNTenterpriseuseridentification,EUID,foryourusername.
Note: Informationongrantingsomeoneelseaccessisgiveninsection9.UserManagement.
TomanageyouDrupal7website,logintotheuserpage(“websitename.unt.edu/user”)withyournormalUNTsystemusername,EUID,andnormalUNTsystempassword.
Then,youcangetstarted.
Throughoutthismanual,auserbar(picturedbelow)willbementionedasameansthroughwhichtoaccess/manageaDrupal7site.Onceyouhaveaccessandlogin,itshouldbeatthetopleftofyourscreen.Ifitdoesn’tappearthere,contactwhoevergaveyouaccessandaskthemforcompleteaccess.
Allofthese“buttons”leadtotoolswithwhichyoucanconfigureyourwebsite.Thehomepagecanbereachedbyclickingthe icontothefarleft.
Note: AllimageexamplesusedinthismanualaretakenfromtheUniversityofNorthTexas’SPOT(StudentPerceptionsofTeaching)website,spot.unt.edu.
“ButwhatifIneedhelp?Imean,anactualpersonwhoknowsDrupalinsideandout?”
Drupalcanbeascarybeast.GoogleisagreatresourceforfindingouthowtouseDrupal(and,well,anything),butgoto10.OtherResourcestolearnmoreaboutUNT’swebsite-managementresourcesandoffices,aswellasotherhelpfulwebsites.
Note: ifyouhavetroublefindingatopic,pressCtrland“f,”thentypethewordyou’relookingfor,andpressenter.Thattool–thefindtool–willtakeyoutoallmentionsofthatword.
3
2.UsefulTermsNow,I’mgoingtogiveyouabunchofinformationthatyoumightnotunderstandorcareabout.Don’tpanic!Understandingmostofitdoesn’tmatterifyoufollowthedirections,butifyou’recurious,here’swhatdifferenttermsmean.
Term DefinitionAnchor Asubsetlinkinsideapagethatleadsdirectlytothatsectionofthepage.
BasicPage Themostbasiccontenttype–youcanputpictures,text,links,andmoreonthis.
Block Thinkofthisasa“box”ofcontentthatyoucanassigntoapageandmovetoablockregionofapage.
BlockRegions Theregionsonapage,whichcanbeviewedbygoingto“Structure”ontheuserbar,“Blocks,”thenBlockscanbemovedtodifferentregions–thisishowyouarrangecontentonapage.
ContentType Acontenttypeisjustwhatitsoundslike.It’swhatapage,article,andwebformare:typesofcontentthatfillvariousroles.
DevelopmentWebsite
A“testsite”inwhichcontentforanewwebsiteisput,andthenthedevelopmentsiteismade“live”:everythingfromthedevelopmentsite(typically,“websitename-dev.unt.edu”)iscopiedintoanactivesite(“websitename.unt.edu”).Thedevelopmentsitecanstillexistafterthis,andcanbeusedasapracticesite.
DisplaySuite Thetoolwithwhichyoucanorganizethewayblocksaredisplayedfordifferentviewmodes.
EditMode Themodeinwhichyoucaneditapage.The“Edit”buttonisaffixedtotherightsideofthepage,under“View”andover“ManageDisplay.”
Menu Alistoflinks,or“menuitems,”thatcanbedisplayedinvariousformats.
Modules The“controlroom”foryourwebsite–here,youcan“flipon”certain“switches,”tochangewhat“buttons”becomeavailable.
Node Apage.Moreaccurately,theuniqueidentifierforanormalpage(asopposedtoaWebformorArticle),foundwhilehoveringoverthe“edit”button(whichisaffixedtotherightsideofuserviewinDrupal7;seeEditMode)andlookingtothebottomleftofthescreen(wherethenodenumbercanbefoundafter“node/”).
ParentItem Theitemunderwhichanodecanfallasasubset.Assigningaparentitemtoapagewillmakethatpageintoamenuitem.
Toggling Thisis“hiding”textbehindanotherpieceoftext.Example:foranFAQpage,youcouldhaveaquestion,andthenuponclicking
4
onthatquestion,text(ananswer)couldappearunderneathit.Ifyouclickedonthequestionagain,thetextwouldthendisappear.
UserBar Thenavigationmenuwhichshowsupatthetopofauser’spagewhenloggedin.Itlookslikethis:
Throughoutthismanual,differentbuttonsonthisbarwillbereferenced(mostlyContent,Structure,andModules).
ViewMode Aformatofpage,article,orwebformthatyoucancreate,thenassignmenustoandarrangedifferentlythanotherviewmodes.
Webform Aregistrationpage.Ithasfill-in-the-blanks,multiple-choiceoptions,etc.thatyoucanusetorequestinformationfromyourwebsite’svisitors.
Weight Theorderassignmentofamenuitem.“Heavier”(greaternumericvalue)itemsfloatdownortotheright,while“lighter”(smallernumericvalue)itemsfloattothetopoftheleft.
WYSIWYG Standsfor“WhatYouSeeIsWhatYouGet,”pronounced“wizzywig.”Thisisthesetofoptionsyouseewhenineditmode,andit’syourtoolboxforeditingcontent.Itlookslikethis:
5
3.SettingWebsiteInformation3a.FrontPageInformation
1)Toeditthe“SiteName”(circledbelow),goto ontheuserbar,looktotheSystemsectiononthetopright,andselectSiteInformation.
2)Here,youcanalsoedittheinformationatthebottomofyoursite(circledbelow).Toedittheseareas,gototheDepartmentInformation,ContactInformation,andSocialMediasections.
3b.FrontPageURLTosetthefrontpageofyourwebsiteasanythingotherthanitsbasicURL(websitename.unt.edu),scrolldowntothe sectionoftheSiteInformationpage(thesamepageusedin3a).IntheDefaultfrontpagebox,fillintherestoftheURL
withthenecessaryaddendum.Thenscrolldownand .
3c.PageRedirects1)ToaddorchangeURLredirects(ormakeapageredirecttoanother),goto
,“SearchandMetadata,”then“URLredirects.”Click ,andaddorcompletethe and URLs. .
2)Youcanalsogotoeditmodeforapage,thenscrolldownandselectthe tab.Select ,completetheURLforthe pageyouwishtoleadtothispage,and .
3d.SearchBar1)Ifyou’dlikeotherstobeabletosearchyoursite,goto and“Blocks.”
2)Lookatblockregionsbyclickingon ,anddecidewhereyou’dliketheSearchBartogo.
6
3)Togoback,select ,anddrag-and-drop(using )the“SearchForm”blocktotheblockregionyou’dliketoplaceitin.OnerecommendedblockregionisUserBarSecond.
7
4.CreatingContent4a.Setup
1)Eachofthefollowingcontentpiecesareautomatically“Published”(visibletothepublic).Tochangethis,gotothe tabatthebottomofeditmodeanduncheckthe“Published”box.
2)Ineachpieceofcontentyoucreate,gobelowtheBody(EditSummary)box,selectintheTextformatbox.FullHTMLformatwillallowtextaddedtotheBody
toappearasyouformatit(withcolor,bolded,etc.).
4b.BasicPageTocreateabasicpage,goto ,then .Clickon ,thenaddatitle(whichwillbecomepartoftheURL).See4e.ContentFormattingbelowformoreinformationonplacingoftext/images/etc.withinyourpage.
4c.Article Tocreateanarticle,goto ,then .Clickon ,thenaddatitle(whichwillbecomepartoftheURL).Articlesareidenticaltopagesincontentformatting.
4d.Webform WebformCreation
1)Tocreateawebform,goto ,then ,then .UnderTextFormat,selectFullHTML.Then,addtexttothe sectionjustasyouwouldtoabasicpage.Thistextwillbeabovethewebformitself.Then .
2)Afteryousave,you’llberedirectedtoanotherpage(the“WEBFORM”tab)whereyoucanbuildyourwebform.Here,youcanseethemajorcomponentsofawebform,whichareexplainedbelow.
a. LABEL
sareshownonthewebform;ifyouwantedtoknowsomeone’sfirstnamewhentheyusethewebform,youcouldwrite“FirstName,”thenselect“Textfield”for .OtheroptionsforLabelscanbe“LastName,”“Position,”“Doyouhaveanydietaryrestrictions?”and“Department.”
b. FORMKEYYoudon’tneedtodoanythinghere!AFormKeyisjustthenameofthecomponentyou’remaking.
c. TYPEOptionsforTypearelistedinthedrop-down.Ifyou
8
wantsomeonetotypeinformationintoabox,“Textfield”allowsthemtodojustthat.ThisistheTypethat’susedmostoften,alongwith“Selectoptions.”UnlikeTextfield,SelectOptionsrequiresyoutoentertheoptionsfromwhichsitevisitorscanchooseone(ormultiple,ifyoucheck“Multiple”asshownabove).UnderOptions*,you’llneedtoaddoptionsasfollows:
1|Titleoffirstoption2|Titleofsecondoption
d. REQUIRED
Ifyouwantafieldtobemandatory,checkthebox under andthen.
e. OPERATIONSUnderthiscolumn,you’llmostlyusetheEditbuttonfordifferentwebformcomponents(itdoeswhatyouthinkitdoes:editthecomponent).Clonecreatesidenticalcomponents,andDeletegetsridofcomponents.
Onceyou ,yourwebformcanbeviewedthroughtheVIEWoptionatthetopofthepage.
WebformResults
1)Toviewwebformresults,gototheupperrightcornerofthewebformpageineditmode,andclickontheResultstab(picturedright).Thereareseveralwaysyoucanviewwhohassubmittedwhat:
a.The“Submissions”taballowsyoutoseesubmissions,andtosortthem,byclickingon“SUBMITTED,”“USER,”“IPADDRESS,”or“OPERATIONS.”
b.Ineverreallymessedwiththe“Analysis”tab;feelfreetoexperimentandaddtothismanual!
c.The“Table”allowsyoutoseedetailsforeachindividual’sregistration,includingthetimetheyregistered,theiruserID(iftheyhadonewhenregistering),theirIPaddress,andtheiranswersforeachcomponentyoucreated.
d.The“Download”taballowsyoutodownloadwebformresultsinaMicrosoftExcelorDelimitedtextfile.ItypicallyuseMicrosoftExcel.Todothis,select“MicrosoftExcel”underExportformat,then“Label”underColumnheaderformat.Click todownloadyourtableofresults.
9
e.The“Clear”taballowsyoutoclearresultsonawebform;usethiswithcaution!Onceyouclearawebform,noneofitsresultscanberetrieved.
4e.ContentFormatting
1)InsertingImages
Toinsertanimage,putyourcursorwhereyouwantanimagetofallonyourpage.Youcansendaphotototheleft,rightorcenterofthepageafteryouinsertit,sodon’tworryaboutthat-justfocusonwhere(vertically)onthepageyouwantthephoto.Savethephotosomewhereonyourcomputerwhereyoucanfindit,thenclickonbuttonlabeled(a).
Click ,then onthetopleft,then .Selecttheimage, ,then .Adjustthewidthandheightbychangingoneofthenumbers:asyouchangeonedimension,theothershouldchangetoaccommodate.Ifitdoesnot,simplyclick ,andgobacktoeditthedimensionsagainbyselectingthephotoandclickingthephotoicon(a)again.Youcansendthephotototheleft,right,orcenterofthepagebyselectinganoptiononthe menu.Youcanalsoaddablackbordertothephoto( ).
2)InsertingLinks
TolinkaURLtoaphotoorsectionoftext,highlightthephotoortextthatyouwishtoleadtotheURL,andselectthelinkicon(b).PlacetheURLintotheURLspace,thenselect .IntheTargetdrop-downbox,selectthewindowyou’dliketheURLtoopeninwhenitisclicked.Click tosave.
3)InsertingTextfromWord(andotherplaces)
ToinsertanyquantityoftextcontentfromWord(oralmostanyothersource),selectoption(d)andpressCtrl+Vtopastethecopied(tocopy,pressCtrl+C)textintothewindowthatopens,andpress tosave.
4)TextColor,Size,andFont
Tomodifythecoloroftext,selectoption(c).Thesizeandfontoftextcanbemodifiedbyusingthebuttonstotheleftofoption(c), .
10
5.Menus5a.Horizontal(Top)Menu
1)Tocreatethisblackbar(picturedabove)andadditemstoit,goto“Structure>Blocks”viatheuserbar,move fromundertheDisabledsection(nearthebottomofthepage)toundertheMenusection,thensave.
2)Toaddvarious“buttons”(asabove,“WelcometoSPOT,”“StudentResources,”etc.),goto“Structure,”“Menus,”“MainMenu”viatheuserbar.Click toaddoptions.UnderMenulinktitle*,assigntheitemwithatitlethatyouwishtoappearonthemenupicturedabove.UnderPath*,inserttheURLtowhichyouwantthebuttontolead.
Note: Tofindthenodeofapage,seeNodeunder2.UsefulTerms.
3)Ifyouwanttoassignanexistingwithin-websitepagetoahorizontalmenu,gotothepage.Under“Menusettings,”click“Provideamenulink,”giveitaMenulinktitle(whichwillappearonthehorizontalmenu),andlistitsParentItemasthenameofthemenuyoumovedandaddedlinksto(above:“<MainMenu>”).Itwillthenappearonthehorizontalmenu.
4)Toarrangemorethanoneoftheseitems,assigneachaWeight(picturedabove).The“lighter”(ormorenegative)anitemis,thefurthertotheleftitwillappear.
11
5b.Drop-DownMenu1)Toaddapagetoadrop-downmenu,createthepage,thenlistitsparentitemaswhateveritem(onthehorizontalmenu)thatyouwouldlikeittoappearunder(picturedright).
2)Assigntheitemweight:“lighter”itemswill“float”tothetopofthelistofmenuitems.
3)Toaddadrop-downitemforadrop-downitem(basically,tohaveanotheroptionappeartotherightofadrop-downoption),simplyassignapage’sparentitemaswhatevermenuitemyouwouldlikeittoappearbeside(thisisdoneintheParentitemboxcircledabove).
4)Tomakeadrop-downmenuautomaticallyappearwhenthemousehoversoveritsparentitem(aboveexample:uponhoveringover“EvaluationForms,”thedrop-downmenuappears),gotoStructure>Menus>Home,thenclick“edit”fortheparentitem(aboveexample:“EvaluationForms”)underwhichyouwishadrop-downmenutoappearautomatically.Checktheboxfor“Showasexpanded,”save,andthedrop-downmenuwillappearautomaticallywhenhoveredover.
5c.On-PageMenusThereareseveralstepsrequiredtocreatemenusthatappearonabasicpage.
EnableModules
First,you’llneedto“flipafewswitches”sothatyoucancreateanddisplayamenu.
1)Goto viatheuserbar,thenscrolldowntothe section,andmakesureDisplaySuiteExtras,DisplaySuiteFormat,andDisplaySuiteUIareallenabled,orchecked .
Savebyclicking atthebottomofthepage.
2)Goto for“DisplaySuiteExtras”.Under“FieldTemplates,”checktheboxfor .Under“Other”,enablefieldsasoutlinedbelow(Viewmodeper
12
node,Pagetitleoptions,Regiontoblock,Viewsdisplays,Viewmodeswitcher,Hiddenregion).
CreateaMenu
1)GotoStructure>Menus>AddMenu,thengivethemenuatitle(whichwillappearonthevisiblemenu)and .
2)Click ,givethelinkatitle,thenassignthelinka“path”(aURLthatthelinkwillleadtowhenclickedon).Addotherlinksthatyouwishtoappearonthemenu.Afteryousaveeachlink,youwillberedirectedtothemainmenu’slistoflinks,whereyoucanadjusttheorderofmenuitems/linksbymovingthisbutton: .Click tosavethisorder.
Note: Toaccessthesemenus,youcanalsogoto“Structure,”“Menus,”andselectthemenuyouwishtoeditorview.
CreateaViewMode
1)Next,gotoStructure>DisplaySuite>ViewModes>AddaViewMode.AddaLabel(ortitle)thatyoucanrecognize,enable“Node”under ,and .
Aftersaving,thetitleofthepage(topleft)shouldbe“DisplaySuite.”Toarriveatthispage,youcanalsogotoStructure>DisplaySuite>ViewModes.
2)Fromhere,clickon intheupper-rightcornerofthepage.ClickforBasicPage,thenscrolldownandselect .Here,click
toenabletheViewModeyoujustcreated,andSave.
3)Now,atthetopofthepage,the“ViewMode”should
13
appearasapageformatoption,asshownabove.
Selectthisviewmode,andonthispage,gotothe“Selectalayout”drop-downbox,andchoose“Two
Column9-3”ifyouwantthemenutobeontherightsideofthepage,and“TwoColumn3-9”ifyouwantthemenutobeontheleftsideofthepage.Save.
AddaBlockField
Afterhavingsavedthisnewlayout,thepagewillshowmoreoptions.
1)GotoCustomfieldsnearthebottomofthepage,thenselect“Managefields”(showntotheright).Then,select .
Note: Anotherwaytogettothesame“Managefields”pageistogotoStructure>DisplaySuite>Fields.
2)Labeltheblockfield(recommended)thesameastheViewModeand/orMenuthatyouareattemptingtocreate.
3)Enable“Node”under .Under ,under“Menu,”selecttheMenuthatyoujustcreated,andsave.
ConfigureBlock
Now,goto“Structure”and“Blocks”viatheUserBar,thenscrolldownandselect fortheMenuyoujustcreated.
1)Createatitlecongruentwiththemenuthatyoujustcreated.
2)Under“Contenttypes”atthebottom-leftofthepage,showblockforallcontenttypes.
3)Under“Roles,”displayblockforwhateverusersyouwanttoseethemenu.Ifyoudonotselectanyroles,theblockwillbevisibletoallusers.Thenclick .
ArrangeBasicPage
Now,theblockfieldisenabledfortheviewmodethatallowsthemenuyouhavecreatedtoappear(confusedyet?Iwastoo).Ontheuserbar,goto“Structure”and“DisplaySuite,”thenselect forBasicPage.
1)SelecttheViewModeyouwishtouse(exampleabove:“Menu1”),makesuretheproperlayoutisselectedunder“SelectaLayout,”thensave.
14
2)Drag-and-drop(using )theBlockFieldyoujustcreatedtothe“Rightside”field(or“Leftside”ifyouwantthemenuontheleftside).Ifyouselect“Leftside”fieldoranotherfield,makesureyoumove“Body”to“Rightside.”For“Body,”makesureyougotothedrop-downboxunder“Label,”andselect“<Hidden>.”Save.
3)Now,gototheabove“Edit”button(picturedabove),andunder“MenuSettings”(picturedright),under“AvailableMenus,”enablethemenuyoujustcreated.
4)Onthesamepage,gotothe“DisplaySuite:Extras”tab,andunder“Viewmodes,”enablethemenuyoujustcreated.
Tosave,click .
EnableViewModeonContentTypes
1)Next,gotothe“edit”modeoftheBasicPagethatyouwantthemenutobedisplayedon.
Atthebottomofthepage,selectthe“Displaysettings”tab,andthenunderViewmode,selecttheviewmodethatyoujustcreatedabove(theonethathasthemenuthatyoucreatedalreadyengrainedinitsdisplay).
Now,save,andthereyouare!Amenuwillbedisplayedontheright-handsideofyourpage.
15
6.NivoSliderYourwebsite’sNivoSliderisa“displaywindow”(examplebelow)inwhichyoucanplacepicturesandcaptions.ToaccessandconfiguretheNivoSlider,goto andNivoSlider.
CreationofaNivoSlider
1) Onceyou’vegoneto andNivoSlider,you’llneedtochooseanimage(ormorethanoneimages)thatwillappear.Asshownright,select“Browse”underUploadanewslideimage,andselectaphoto.Upload.
Note:Beforeaddingphotos,cropeachimageasnecessarytomakesuretheimagesyouuploadareallthesamesize.
2) Afteryouupload,you’llbesenttoapagewhereyoucanspecifyhowyouwanteachimagedisplayed.YoucanaddmoreimagesthroughthesamemechanismyouusedinStep1),andthey’llappearintheordertheywereuploaded(shownright).
3) Abovethelistofimages(shownright),thereisanothermenuofoptions.Here,youcanre-arrangeNivophotos,selectwhetherornotthey’republished,orselecttodeletethem;notethannoneofthesechangeswillbesaveduntilyouclick attheverybottomofthepage.
4) Ifyouselectanimage(“Image1:”or“Image2:”etc),youcangiveitaTitle,Description(here,makesuretochangetheTextformattoFullHTMLbeforeinsertingtext),youcanLinkslidetoURL,decidetoShowslideonspecificpages,andselecttheTransitionstyleinwhichtheslideswillprogress.
16
Note: ToLinkslidetoURL,insertthepathofthein-websitedestinationpage.Example: for“website.unt.edu/content/example,”insert“content/example.”
5) Underthe tab,youcaneditslidespeed,size,placement,andappearance.Forbestresults,select“Default”under“Theme,”donotenablethe
function,andclick .
6) tosavechanges.
On-PagePlacementoftheNivoSlider
TosendtheNivoSlidertoablockregion(asshowninthefirstexampleabove),gotoandBlocks.DragtheNivoSliderblockuptotheregioninwhichyouwishitto
fall(recommended:PrefaceFirst).Click tosave.
Now,yourNivoSliderwillbevisibleonallpagesofyourwebsite.
Note: You’llnoticethattextsaying“NivoSlider”isaboveyourpublishedNivoSlider.Totakethisaway,gobacktoStructure>Blocks,findtheNivoSliderblock,clickconfigure,andunder“BlockTitle,”replacetitlewith<none>.
17
7.TogglingAsexplainedin2.UsefulTerms,togglingisagreattoolfor“hiding”contenttoconservespace.It’scommonlyusedforFAQpages,whereaquestioncanbeclickedontoseeitsanswer,andthenclickedonagaintohidethatanswer.
Here’sanexample:https://spot.unt.edu/content/student-resources
7a.SetupFirst,goto ,“ContentAuthoring,”and“CKEditor.”UnderProfiles,selecteditforthe“Full”Profile.SelectADVANCEDCONTENTFILTER,andselectthe“Disabled”button(shownright),thenscrolldownand .
7b.CodeforToggling1)Totoggle,yourpage’sTextformatneedstobeinFullHTML(see4b.BasicPageforanexplanation).
2)Then,ineditmodeforyourpage,select“Switchtoplaintexteditor”(locatedbelowthebottomleftcornertheBody(Editsummary)section).Now,you’rereadytoinsertcode.
3)Copy-and-pasteeverythingthat’sbelow(allpurple,green,andbrowntextthat’sbetweenthetwoblacklines)intotheBody(Editsummary)section,andthen .
DONOTEDITTHEFOLLOWINGSECTION.
<styletype="text/css">a:hover{
cursor:pointer;
text-decoration:none;
}
</style>
<scripttype="text/javascript">
jQuery(document).delegate(".toggle",'click',function(){
varcollapser=jQuery('#toggle-'+this.id);
if(collapser.is(":visible")==false){
jQuery('.animated').hide();
18
collapser.show('slow');
}else{
collapser.hide('slow');
}
});
</script>
<p>Thisisanintroductoryphrasethatyoucanputabovetoggledmaterial.</p>
<h5class="toggle"id="thisistheidforfirstquestion"><a>Thisisyourfirstquestion?</a></h5>
<divid="toggle-thisistheidforfirstquestion"style="display:none;">
<pclass="rteindent1">Thisisyourfirstanswer.</p>
</div>
DONOTEDITTHEABOVESECTION.
Voila!Whenyouclickon“Thisisyourfirstquestion?”wordswillappearunderneath.Ifyouwanttoaddmore,keepreading!
4)Noticethe“thisistheidforfirstquestion”–thisistheuniqueidentifierforthefirstquestion/answerpair.Foreachadditionaltoggledpair,you’llneedtocreateanewID(withnospaces,nonumbers,andnocaps),whichcanbeanynonsenseyouprefer.
5)Toaddaquestion/answerpair,copyandpastethebrownsectionabovebelowthefirstquestion,andadjustwordingasnecessary.
5)Don’tchangeanyofthespacinginthecode;thesmallestchangescanrenderitinvalid.Justreplacewordingasnecessary.
7c.InsertingImagesintoToggledCode/TablesThebestwaytoaddimageswithintogglecodeisto:
1)Addtheimageoutsideofthetoggledmaterial.
2)Then,copyandpasteallthatisincludedandwithin<td><imagalt=""srcand/></td>.Asanexample,belowisanexampleofwhatyouwouldneedtocopy/paste:
<td><imgalt=""src="//advisortraining-devd7.unt.edu/sites/default/files/picturename.jpg"style="width:100px;height:55px;"/></td>
19
<tr>
<td><em>LauraFlowers,<em>ArtsandSciences</em></em></td>
<td><em>AdvisoroftheYear</em></td>
<tdclass="rtecenter"><imgalt=""src="//advisortraining-devd7.unt.edu/sites/default/files/ATW_Laura%20Flowers_0.jpg"style="width:126px;height:190px;"/></td>
</tr>
20
8.PageJumpsSometimes,apagehasalotofcontentonit.Ifyoudon’twanttotoggleandcondenseallofthatinformation,pagejumpshelpyoutogoquicklytoasectionofthatpage,eitherviaanoutsidelink,ora“tableofcontents”orlinkonthepageitself.
8a.In-PageJumps1)Forbothofthefollowingoptions(8aand8b),gotoeditmode.Highlightthetext/imagethat’satthetopofthesectionyouwanttojumpto.Then,clickontheanchorbutton(picturedright),andgivetheanchoraname(picturedbelowandright).
a2)Then,highlightthetext/imagethatyouwanttoleadtothesectionofthepagethatyoujustsetastheanchor.
a3)Selectthelinkbutton andunder“LinkType,”select“Linktoanchorinthetext”(picturedbelow).
Withinthe“SelectanAnchor”box(picturedleft),andunder“ByAnchorName,”choosetheanchoryoujustmadeandthenclick .
Click atthebottomofthepagewhenyou’redone.
8b.Out-of-pageJumpsWhatifyouwantedanoutsidelinktoleadtothatanchoryoujustmade?Easy!
Note: Youwillhavehadtocompleted8abefore8b.
b2)Aftersaving,clickonthelinkthatyoumade.That’lljumpyoudowntotheanchoritself,butnoticethattheURLatthetopofyourscreenchanged.
b3)CopyandpastethisnewURLtootherpagesthatyoumake,andit’llleadrighttothat“subset”ofthepage.
8c.DeletingAnchors/JumpsToremovethelinktotheanchor,clickonthetextthat’slinkedtoitandclick
Toremoveoredittheanchoritself,rightclickontheanchor(therewillbeanexttoit)andselect“EditAnchor”(tochangethename)or“RemoveAnchor.”
21
Note: Ifyouchangetheanchor’sname,itsURLwillchange.You’llneedtoeditanyplaceswhereyouputthatlink–theoldonewon’twork.
Rememberto allyourwork!
22
9.UserManagement9a.GrantingAccess
1)ToaddausertoaDrupal7website,gototheuserbar,andselect“People,”“AddUser.”
2)ForaUNTDrupalwebsite,usethenewuser’sUNTeuidastheir .Addthenewuser’se-mailaddress,andany (tomyknowledge,thepasswordyouenterisirrelevant,asUNTwillalreadyassociatetheireuidwiththeirUNTsystempassword).
Whenthenewusersignsin,theymustusetheirUNTeuidandUNTportalpassword.
3)Next,selectthenewuser’s as ,thenselectalloptionslistedunder.There’snoneedtoenable ,andthere’snoneedto
botherwith .
9b.EditingAccess
1)Toeditacurrentuser’spermissions,goto“People”and“Permissions,”then .
2)Goto under fortheuser’srow,andeditasyoulike.Imyselfdon’tknowwhatthedifferentpermissionsmean;foranyuserwhowillbemakingedits,Itypicallywouldgivethemallpermissions.
9c.DeletingAccess1)Todeleteordisableauser(fromthepagementionedin9aand9b),gotothedropdownboxpicturedtotheright.Here,youcanselectusersandblock,unblock,andcanceltheiraccounts,aswellasaddtoorremovefromtheirroles.
2)Pressthe“Update”buttontosavechanges.
23
10. OtherResourcesGeneral https://omega.unt.edu/WebDevelopment,ITServices,CollegeofArts&Sciences
http://itservices.cas.unt.edu/services/web
HelpDesk,UniversityIT https://it.unt.edu/drupaluserhelpNivoSlider https://www.ostraining.com/blog/drupal/nivo-slider/HTMLCodingInstructions www.w3schools.comITSSCentralWebServices(CWS) https://itss.untsystem.edu/divisions/ets/cwsITSSCWSServiceNowTicketingSystem
Here’swhereyoucansubmita“helpme!”tickettothegeniusfolkatCWS.
1) Gotohttps://unts.service-now.com/andloginwithyourEUIDandpassword.
2) GotoRequestaService>WebServices>Internetandthenselecttheitemthatbestdescribesyourrequestorissue.
3) CompletetheformandclickOrderNow.UNTIdentityGuide http://identityguide.unt.edu/build-your-project/web-
email-social-media
ThispublicationisprovidedbytheUniversityInformationTechnologyDrupalUserGroup,April2017.Formoreinformation,contacttheauthor,Dr.MarianSmith,orUITDrupalHelpDesk.
