Owner's Manual

Accessing Your Website

Let’s take a step-by-step tour through your Drupal site and see how the different functions work and how to make your new site your own. 

Logging Into Your Website

Begin by logging into the administration area or the back end of your website. Visit your site’s login page by placing “user” after your domain name, or by clicking here.

If for whatever reason you do not remember your username and password, you can recover this information by clicking the Reset your password tab in the login prompt screen, or by clicking here

User Management

An Administrator can add, remove, or edit any user on the site by clicking the People link the admin toolbar, or by clicking here. On this page, the Admin will see a filterable and sortable list of users as well as a button labeled Add User.

Adding a User

• Click here to add a user.
• Fill out the login information (all of this can be changed by the user once they have logged into the site).
• The User will also be able to reset their password on the login page so there is no need to send the password the admin has created to the User.
• Ensure the User's status is Active. 
• To notify the User of their account's creation, check the box labeled Notify User of New Account.

User Roles and Permissions

• Content Administrators has full power over the content of the site and can do everything related to site administration*. Administrators can create more Administrators, invite new users,  remove users, and change user roles. They have complete control over posts, pages, uploaded files, settings, other users.

• Editors can create, edit, publish, and delete any post or page (not just their own), as well as moderate comments and manage categories, tags, and links.

• Authors can create, edit, publish, and delete only their own posts, as well as upload files and images. Authors do not have access to create, modify, or delete pages, nor can they modify posts by other users.

• Contributors can create and edit only their own posts, but cannot publish them. When one of their posts is ready to be published or has been revised, the Administrator needs to be notified personally by the Contributor to review it. Furthermore, once a Contributor’s post is approved and published by an Administrator, it can no longer be edited by the Contributor. Contributors do not have the ability to upload files or images.

• Subscribers do not have any editing privileges on your site whatsoever. They have the ability to view private member-only content.

Managing Navigation

To view the menus, go to Structure > Menus, or click here. The Main Menu holds all of the links for main navigation items. To edit the navigation items under Explore Issues you would need to edit "Policy Priorities", "Projects and Campaigns", "Housing Programs", "Publications and Research" and "Why We Care" menus that make up that mega menu under Explore Issues. The footer navigation menu is located in a Custom Block. Click here to view the section for information on how to edit the footer. 

Menus

• To edit the Main Navigation, click here, then click on the dot navigation icon. 
• To add a new Menu Item, click on the Add Link button. 
  • Add a Menu Link Title. This is the text that will display in the Menu for visitors. 
  • Add a Link. To add an internal link, start typing the name of the page in the autocomplete box to narrow the selections. To add an external link, type in the URL. 
  • If the link should open in a new tab, click on the Attributes accordion and change the Target to New Window. 
  • If the Menu Item should be nested under another page, select the correct parent page under Parent Link. 

To rearrange Menu Items, click on the horizontal line icon before the Menu Item title and drag the Menu Item to the correct place. To delete or edit Menu Items, click on the dot navigation icon. 

Do the same thing for the submenus under "Explore Issues" to edit the mega menu

Managing Content

Any content type can be created by hovering over the Content link in the toolbar, hovering over Add Content, and picking the content type you'd like to create.

Each content type can be saved as a draft and previewed before publishing. To save content as a draft, uncheck the Published checkbox. 

Pasting from Word

To ensure that any content copied from a Word Document and pasted into this site is correctly formatted, a few steps must be taken. 

• Within the Body field, make sure that the Text Format dropdown value is "Filtered HTML". 
• Click inside the Body textarea and hit the Cmd + V keys to paste the content copied from Word into the WYSIWYG.
• The user will now be presented with a pop-up box acknowledging that the text has been copied from Word, and then asking the user if the text should be cleaned up before pasting.
• Click "OK" and the text will then be pasted into the WYSIWYG 
• Once pasted in, feel free to switch back over to "Full HTML" in order to gain access to all of the CKEditor editing options.

Full Page

The Full Page content type comes equipped with a Paragraphs section. Please reference the Paragraphs Guidelines section on this page for any further instruction.

• Click here to add a full page.
• Header Options can be used to customize the pages hero section, which includes the Header, Header Sub Header Text, and the Background Image around the content.
• Page Builder Options allows you to use paragraphs to create design “elements” for any page. Elements can be thought of as building blocks - stack and customize them how it fits your needs.
• Tale Action is for the "Take Action" page so you can add those CTAs. To add a CTA you need to add a "title", "url" that points to the Take Action embed code and "link text" for the text of the button.
• Featured Content Box allows you to control what shows up in the homepage carousel. If you wish to add a page to the carousel go that page and edit it.
  • Check "Promoted to front page" under Promotion Options on the right sidebar
  • Fill out the "Featured Content Options" with the box text with a title (h4 tag), a paragraph about page (p tag), and a link to the page (a tag) 
  • Under "SEO Options" you need to add a "featured image" that will become your carousel image.
• The Featured Image is used for card/feed displays as well as Social Sharing.
• Add a Meta Description associated with the post.
• Add any Tags associated with the post.
  • The SEO Options above control the homepage carousel of box content of featured pages. The Featured image is the box content's image, the meta description will be the box content's text.
  • To make a full page appear in the homepage slider you need to fill out the fields above and also go to the right sidebar under Promotion Options check promoted to front page

Updating PDFs or Links on Pages

To update documents or links on pages, follow the instructions below.

• Edit the paragraph where the link is located.
• in the Content box, click on the link to select it and then click on the link icon in the Content toolbar.
• Click on Open File Browser to upload the updated document or search for the document. Click save to update the link.
• To start a file download when a document is linked, click on Source and find the anchor (a) tag for the link. Add the following attribute: download="FILE NAME". Example: "<a href="link-goes-here" download="FileName.pdf">Link Text Here</a>".

Event

• Click here to add a new event.
• Add a Title. This is required.
• Add the event description under Body and add a Description or short excerpt by clicking the Edit Summary link right above the main body content field.
• Scheduling Options allows you to provide a date for the event. Note if the event is just for day make sure to add the same date for the start and end date.
• Location Options allows you to provide a location address for the event.
• Youtube Video ID allows you to add the video id from a Youtube video to pull into your event page.
• Register Button allows you to add a register button if you wish just provide the "url" and "link text" that will be the button text to make it appear
• Event Files allows you to add your desired file attachments such as a PDF. If you wish to upload the title of the file edit the description field.
• Select the Event Category associated with the post under Taxonomy Options. Multiple items can be entered or selected. To add new items, enter the title of the item in the text box and separate each selection with a comma. To add a "notable past event" you need to check notable past event under taxonomy options
• The Publishing Date can be modified in the right sidebar.
• The Featured Image is used for card/feed displays as well as Social Sharing so make sure to add one!
• Add any Tags associated with the post.

Memo to Members

• Click here to add a new Memo item.
• Add a Title. This is required.
• Add a Description or short excerpt by clicking the Edit Summary link right above the main body content field. Add to the Body to create your main content.
• Attached Files allows you to add your desired file attachments such as a PDF. If you wish to upload the title of the file edit the description field.
• Included Articles allows you to attach your resource items to the memo by typing in the name of the resource add and selecting it. You can add as many as you want by using the "add another item" button.
• Tag the Memo Year so the filtering works on the main memos page
• Tag the Memo to Members Category so the filtering works on the main memos page
• The Publishing Date can be modified in the right sidebar.
• The Featured Image is used for card/feed displays as well as Social Sharing. Social Driver has provided a default placeholder image which you will see if the field is empty.
• Add any Tags associated with the post.

News

• Click here to add a new News item.
• Add a Title. This is required.
• Add a Description or short excerpt by clicking the Edit Summary link right above the main body content field. Add to the Body to create your main content.
• Select the Issue Area, News Category and Tenant Talk associated with the post under Taxonomy Options. Multiple items can be entered or selected. To add new items, enter the title of the item in the text box and separate each selection with a comma.
• Article Source Details allows you to link to an external article add the News Outlet name and link to the article under this section.
• Attached Files allows you to add your desired file attachments such as a PDF. If you wish to upload the title of the file edit the description field.
• The Publishing Date can be modified in the right sidebar.
• The Featured Image is used for card/feed displays as well as Social Sharing. Social Driver has provided a default placeholder image which you will see if the field is empty.
• Add any Tags associated with the post.

State Reports

• Click here to add a new state report.
• Add a Title. This is required.
• Header Options can be used to customize the pages hero section, which includes the Header, Header Sub Header Text, and the Background Image around the content.
• Add a Description or short excerpt by clicking the Edit Summary link right above the main body content field. Add to the Body to create your main content.
• For each tab item, there is a section that controls the fields for the content.
  • State Data Overview controls the data visualization.
    • Add your overview text about the data under State Data Overview Text.
    • Under "State Data File Upload" this is where you upload your CSV file containing all your state data that follows the format Social Driver gave you to follow to display all the charts.
      • All data updates are to be made directly in this Google sheet: https://docs.google.com/spreadsheets/d/1JvywGwUzvQzc7VqOgA8W7nRTaHdVPvnAF-NWsqMRvjM/edit?usp=sharing. After those updates are made, go to File -> Download As -> CSV, then upload it to this file.
      • Do not open the file on your computer or edit it in a different file format prior to uploading it to the site, as that could lead to problems.
  • State Level Partners controls the state level information under the section NLIHC Housing Advocacy Organizer Info.
    • Add a Housing Advocacy Organizer Image along with NLIHC Housing Advocacy Organizer Info that includes the name of the organizer, phone number and email below the name
    • Add a State Partners using the text editor making sure to build the organization and organizer's name along with making the phone numbers and email addresses links.
    • Add Other Links associated with the state partners using the text editor
    • Add Attached Documents by uploading as many files as needed and if you wish to control the name of the file update the description field.
  • Housing Trust Fund Info controls the HTF information under the section Housing Trust Fund Info
    • Add a HTF Implementation Information using the text editor.
    • Add a HTF Implementation Image if you do not wish to use the default HTF logo
    • Add the Current Year HTF Allocation using the text editor with the number and a link to PDF of previous allocations.
    • Add the HTF State Resources using the text editor with the year as h4 and list the appropriate file links below.
    • Add the NLIHC Point Person for HTF Advocacy using the text editor with the organizer's name, title, organization name, phone number and email.
    • Add the State Designated Entity using the text editor with the organizer's name, title, organization name, phone number and email.
    • Add the Official Directly Involved with HTF Implementation using the text editor with the organizer's name, title, organization name, phone number and email.
    • Upload the Recent HTF Report using the file upload button and make sure the description is "Recent HTF Report" for the button name
  • Additional Resources controls any additional resources needed for the state.
    • In the text editor add any additional resources by making the year an H4 header and place the associated links below this header.
    • For the related articles section you need to make sure to tag resources and or news items with the appropriate State taxonomy to get the feed to show up on the front-end.
  • Take Action controls the take action CRMs.
    • In the text editor add the Take Action embed code provided by KnowWho.
• The Publishing Date can be modified in the right sidebar.
• The Featured Image is used for card/feed displays as well as Social Sharing. Social Driver has provided a default placeholder image which you will see if the field is empty.
• Add any Tags associated with the post.

Resources

• Click here to add a new resource.
• Add a Title. This is required.
• Add a Description or short excerpt by clicking the Edit Summary link right above the main body content field. Add to the Body to create your main content.
• Under Media Options this is where you would add a the cover photo of the resource and then upload the link to the resource under downloadable resource. Also you add the Libsyn ID or YouTube Video ID under Media Options. This is used to populate the embed code on the front end of a Podcast or Video.
• Select the Issue Area and Resource Type associated with the post under Taxonomy Options. Multiple items can be entered or selected. To add new items, enter the title of the item in the text box and separate each selection with a comma.
• If this resource is a research piece tag it using Research Type taxonomy to make sure it pulls through on the research feed on the research page. Also important to note to make the "Fact of the Week" feed work on the research page, you will need to make sure the resource item is tagged as "fact of the week" for research type and if you want it to be the main featured one in the feed you need to check fact of the week feature. ***you also need to add a featured image to make an image appear in the feed correctly.
• The Publishing Date can be modified in the right sidebar.
• Attached Files allows you to add your desired file attachments such as a PDF. If you wish to upload the title of the file edit the description field.
• The Featured Image is used for card/feed displays as well as Social Sharing. Social Driver has provided a default placeholder image which you will see if the field is empty.
• Add any Tags associated with the post.

Paragraphs

This will allow the user to easily create design “elements” for any page. Elements can be thought of as building blocks - stack and customize them how it fits your needs.

Basic Block

• The Basic Block Paragraph Type is used for content that doesn't require any functionality.
• To add a gradient background to the block, enter a list of hex codes separated by a comma (i.e. #4876BD,#5448BD) to define the gradient using the Data gradient bg field.
• Custom HTML code can be added to the Basic Block. To add custom code, click on the Source button in the WYSIWYG. 

• Accordions

  • Important to note you need HTML knowledge to do this highly recommend contacting Social Driver for this
  • For an example of accordions look at this page: https://nlihc.org/explore-issues/publications-research/advocates-guide
  • We suggest copying this block into a text editor such as Sublime or Atom to better see the code and swap out the "panel-title" and content within class "panel-body"
  • It is important to note you need to make sure the "panel-collapse" ID matches with the "panel-title" href and aria-controls
  • When your code is ready add a new block and make sure it has the class of accordion

Image Edge Block

• This Paragraph Type is used to place an image on one side of a block of content using the Image Position field. 
• Images can be positioned to the Left or to the Right. 

Image Background Block

To add an Image or Gradient background to a block of content use this Paragraph Type.

• Add a Background Image.

• Check Content Vertical Center if you'd like the content to be centered vertically within the box.
• Change the Data Overlay field to adjust how transparent a dark overlay is on the background image.
• To add a gradient background to the block, enter a list of hex codes separated by a comma (i.e. #4876BD,#5448BD) to define the gradient using the Data gradient bg field.

Tabs

This Paragraph Type can be used to add a vertical or horizontal tabbed menu to a page.

• For each Tab, a Title and an Image can be added, which will appear inside of the Tab that the user clicks to view information. The body text of the Tab should be added to the Content section.
• You can also add more Paragraph Types on a specific Tab Item using the Tab Paragraph field.

Fullwidth Block

A Fullwidth Block should be used to add content that needs to break out of the width of its container. This Paragraph Type comes with a Views Reference (see the Views Reference section below for more information) as well. (The Views Reference should only be used by developers and experienced content admin.)

Cover Block

Similar to a Fullwidth Block the Cover Block allows you to add a background image that spans the entire width of the page but leaves the comment within the normal container.

• Add a Background Image.

• Check Content Vertical Center if you'd like the content to be centered vertically within the box.
• Change the Data Overlay field to adjust how transparent a dark overlay is on the background image.
• To add a gradient background to the block, enter a list of hex codes separated by a comma (i.e. #4876BD,#5448BD) to define the gradient using the Data gradient bg field.

Sliders Block

The Sliders Block is used to add a Slideshow or Carousel to a page and comes equipped with some very useful features.

• Check whether the Slider should have Display Arrows, Display Pager, or whether the Slider should span the full width of the page or be contained.
• Add a Title and Content for the Slider. This will appear above any Slider Items.  
• Slider Item, you can add an Image and Content.
• To add additional Slider Items, click on the file icon at the bottom of the paragraph. 

Video Background Block

If the user would like to add a Video as a background to a block of content, the Video Bg Block should be used.

• In the Youtube Video ID field, enter the Youtube video id here, for example, if the full link is https://www.youtube.com/watch?v=4g4w0kipyNs, the ID will be 4g4w0kipyNs
• The Youtube Video StartAt field allows the user to enter the time in seconds for the video to start.
• Add a Background Image as a fallback in case the video doesn't load for the user.
• Change the Data Overlay field to adjust how transparent a dark overlay is on the background image.
• Add text to Content. This text will overlay on top of the video background. 

Editing and Removing Paragraphs

To edit or remove paragraphs from a page, click on the file icon located in the paragraph row. A drop-down will appear with Edit and Remove options.

When removing a paragraph, the deleted paragraph will remain on the page until the user confirms removal.

To confirm, click on the file icon again and a drop-down will appear with Confirm Removal and Restore options.

Views Reference

This Paragraph Type can be used to add a view to a page. Views function as feeds to display specific types of content. This should only be used by developers and experienced content administrators. Please contact Social Driver to edit or add new Views to the website. Use this block to add an existing view to a page.

Custom Blocks

Custom blocks are used when the same content needs to be displayed in multiple locations. Please contact Social Driver for assistance in creating additional custom blocks or configuring custom block locations on the site.

Redirects

Redirects can be added and removed using the Redirect module. The redirects page can be found by using the Menu Search feature in the admin toolbar, or by using the path clicking here. To add a new one, click "+ add redirect" at the top. Fill out the Path field with the URL you want to redirect and fill out the To field with the new URL you want that old URL to go to. 

SEO and Metadata

SEO is an extremely important aspect of your site and something to consider whenever you update or add any new site content. Social Driver has installed several tools to help guide you toward matching your site content with important keywords.

When editing any page on the website, you will find an SEO Options section that will allow you to customize your featured image, excerpt, and focus keywords. If you do not see an Excerpt or Meta Description field in this section, you can update your excerpt by clicking the Edit Summary link just above the main body content section. Below you will find five important concepts to keep in mind when creating SEO-friendly content.

Title Tag

• Avoid duplicate title tags
• Keep title tags at 55 characters or less in length, including spaces.
• Your title tag should be written like this: Primary Keyword – Secondary Keyword | Brand Name
• Use a dash in between your keyword phrases and a pipe at the end before your brand name

Meta Description

• Write compelling meta descriptions (for CTR)
• 150 to 160 characters is the recommended length
• Avoid duplicate meta descriptions
• Do not use quotes or any non-alpha characters
• Use Target keywords in the description

Heading 1, H2, H3

• Use H1 Tag for Page title
• Use your keyword phrase once in your H1 tag
• Use H2, H3 tags for subheadings if there are multiple sections

Anchor Text

• When linking to another page on the same site from within content, select good anchor text (keywords) to use in the actual link and do this often. For example: “We offer *target keywords* services,” rather than “Click here.”

Image ALT tags and filenames

• Include your keyword phrase in the name of your image. Name all of your images in a way that describes what they are.
• Do not use non-alpha characters in your image or file names (no %, &, $, etc)

Tracking Code Management

Tracking codes can be added to the site via the JS Injector module. Click here to manage those settings.

1. Click Add JS Injector or Edit one of the Injectors in the list.
2. Give the Injector a Label.
3. Add your code snippet in the required Code field.
4. Make sure Preprocess JS and Load the script in the header of the page are checked.
5. Use the conditions section to add the injector to the desired areas of the site.
6. Click Save.

More specific information based on the tracking code provider can be found at the following:
Facebook Pixel: https://www.facebook.com/business/help/952192354843755
Google Analytics: https://support.google.com/analytics/answer/1008080?hl=en
Google Tag Manager: https://developers.google.com/tag-manager/quickstart