📚 Readme

Table of Contents (not exhaustive):

1. 👉 General Site Elements 
2. 👉 Homepage 🏠
3. 👉 Membership Process
4. 👉 Action Center
5. 👉 People Pages
6. 👉 Vision/Policy Pages
7. 👉 Blog Post Pages

👉 General Site Elements 

🔻Headers

• Full banner image headers are available on feedback, petition, basic, and volunteer signup as well as of course donation v2 pages and the homepage - but we will refer to those in a moment, as they are different.
• On these pages - the background defaults to yellow with black text in the header section
• The background image of the header is defined in the page's featured content slider. The first image in the featured content slider is the one that will show in the header. You can find this by going to "featured content sliders" under a page's settings. Upload an image here for the background (ideally a wide, landscape style image). You will also want to add the image to the page's "Files." The large headline overlaid on the banner is the page headline. 
• On some pages a small amount of paragraph text shows up below this the page headline:
  • On feedback pages it is the text in the content box above the horizontal line that divides the box, the rest of the text goes to the left of the form on the page.
  • On petition pages it is the "intro" content.
  • On volunteer signup pages it is the text in the content box.
  • On basic pages tagged with "vision" or "action center" it is the page content.
• Headers for Donation v2 pages are uploaded into the page attachments - you must upload an image into the donation page's attachments with the suffix "-header" for the image to appear. The text overlaying the header is the page headline and the page content.
  • 🔹 These headers do not appear on custom membership payment donation pages

🔹 NB - for all headers on all pages that use the featured content slider - do not worry about the "page to feature" input area - you can simply always put "home" there as it is not coded into the header and will not affect anything.

🔻Header and Footer

• The header nav is relatively self explanatory - except for the buttons.
• The donation button is whatever donation is on the top nav of the site.
• The other button for "Become a Member" is whatever page in the site is checked as "Include in supporter nav" in the page settings - if you want to change this button, simply uncheck this on the "become a member page" and check it on a different page.
• The buttons in the footer are shown in the exact same way.
• The content in the footer is the footer content which can be edited in the site settings, and the social media nav is addressed below.
• The 4 columns of links in the footer are pulled from a page with the slug "footer_links" - 🔹 please do not change the slug of this page.
  • Each subpage of this page is a column of links in the footer - and the links are simply written in a list in the content section.
  • The headline of the page is the title, or non-link word, that will show above each column.
  • Each child page must have "include in top nav" in order to show, and the columns can be re-arranged by dragging and dropping the subpages in the "top nav" tab of the "footer_links" "subpages" section.
  • Make sure to only have 4 children included in the top nav at all times and ideally only have 4 links per column.

🔻Social Media Navs

• In the homepage and in the footer there are social media icons that correspond to your organisations social media. The links for each of these icons are controlled in the page with the slug social_media_info  -  🔹 please do not change the slug of this page.
• The content section of this page is split into 4 sections - in each section there is the link to the respective social media. The order must always remain as follows: 1. Twitter 2. Facebook 3. Instagram 4. WhatsApp 5.LinkedIn . If you need to change your social media account/info - you do so here, but please always keep this order the correct link will correspond to the correct social media icon.
  • In all social media sections except for twitter you simply put the the link to the page - for twitter just put your twitter handle.
• At the moment - the footer simply shows the first 3 and will not show any more unless we change the code to do so.

🔻Blog page filtering

• All blog pages have a dropdown filter which users can use to sift through blog posts by tag. The way this works is by tagging both the post, and the blog page itself.
• If the post is tagged but the blog page itself is not, then the tag will not show.
• If you add a tag to a blog post, and the tag is already on the blog page, then you do not need to add it again.
• You can tag as many posts as you want with as many tags as you want - but consider keeping it minimal.
• The filter will only work for posts shown on that page - i.e. if they click to the second page of posts, and they click a tag on the filter, it is possible that none will come up, and this is because the posts are on another blog page. The filter works by filtering those that are on that specific page of pagination.
• Best practice is to change the limit of posts shown per page to as large a number as possible - i.e. 100 so that all posts can be sorted by the user.

👉 Homepage 🏠

🏠 Header 

• The hero image on the homepage is pulled from the featured content slider of the homepage. If there is more than one image there it pulls the first one only.
• The heading text is the homepage headline.
• The content box of the homepage is split into two:
  • The content above the horizontal line is the paragraph text that goes below the heading text.
  • The content below the horizontal line is where you need to put the watch code for the youtube video that will open when users click the "watch" button.
    • You simply need to paste here the code that is at the end of your youtube link - i.e. everything that comes after "v=" in the link - see the image below.
    • 

🏠 Sign Up Banner

• The signup banner pulls from the subpage of the homepage that is a signup page. Because of this please make sure only one signup subpage of the homepage has "include in top nav" checked - it must have this checked in order to show.
• The fields on this banner are fixed, and a consent needs to be set up on the sign up page for the form which will allow users to be contacted further by the organisation.

🏠 Narrative Section

• The section below the signup banner is the narrative section and is whatever subpage of the homepage, that is "included in the top nav" and has "about" in the slug.
• The image on the left is pulled from the featured content slider of the page, the heading text is the page headline, the paragraph text below is the page content.
• The underlined link below this section is pulled from the same featured content slider as the image - the feature page url is where the link goes, and the feature headline is the text of the link.

🏠 Actions Section

• The home actions are 3 actions pulled to the homepage with the tag "home action".
• The types of pages supported for this are volunteer signup, signup, and donation v2.
• The page headline is the heading text, and for each of these pages their content box must be split with a horizontal line - the text above the horizontal line is what will show in the card
• The button goes to the respective page - and for donations, the listed donation amounts in the page each link to the donation page with this amount chosen.
• Please note that if you have more than 3 pages tagged with "home action" that only the 3 most recently tagged will show. Order is also determined by the order of tagging.

🏠 Vision/Policies Section

• The section below the actions with the card slider is whatever subpage of the homepage, that is "included in the top nav" has "policies" in the slug.
• The heading text to the left is the page's headline, the paragraph text below it is pulled from the page's content, and the underlined link is pulled from featured content slider - the feature page url is where the link goes, and the feature headline is the text of the link.
  • It will require you to input an image, but this is arbitrary and is not coded to appear so simply input dummy content.
• The slider is comprised of the subpages included in the top nav of the basic "vision" page - i.e. a basic page that has the tag "home vision".
  • The background image on each card is the image that lives in the page's file attachments that has the suffix "-card".
  • The text is the page headline, and the button goes to the page itself.
• The slider is limited to 6 images for site weight reasons - the 6 that will show are the first 6 on the top nav of the vision page, you can re-order these by dragging and dropping in the respective tab.

🏠 Leadership Section

• The section below the vision slider is whatever subpage of the homepage, that is "included in the top nav" that has "leadership" in the slug.
• The image on the left is pulled from the featured content slider of the page, the heading text is the page headline, the paragraph text below is the page content that is above the horizontal line.
• The underlined link below this section is pulled from the same featured content slider as the image - the feature page url is where the link goes, and the feature headline is the text of the link.
• The black map section at the bottom of the section is pulled from the content below the horizontal line where you can change the link and link text.
  • Please ensure to keep the formatting the same to ensure it looks correct in the section.

🏠 Blog Section

• This section pulls the headline of the blog page with the slug "latest news" and the 3 most recent blog posts to the homepage.

🏠 Social Media Section

• The Curator feed in this section is somewhat editable from the back end of your curator account.
• The social media icon link configuration is detailed here.

👉 Membership Process

• This membership process works exactly as the former one worked, with a few little changes.
• The header of the membership process includes a logo that links to the site homepage, and the downloadable form button, both of which are hardcoded.
• The footer pulls its content from the footer content in the site settings.
• The initial landing page (step 1) for the membership process is become_a_member, which is a sign up page. 
  • The image on the right is pulled from the page's featured content slider.
  • The heading text is the  page headline.
  • The content box is split with a horizontal line - this is because these pieces of content are formatted differently. 
    • A summary, into to membership should be placed above the line.
    • Questions with links should be placed below
  • All the form fields and their labels are hardcoded, with a few exceptions.
    • In the volunteering section of the form, each of the options is pulled from the page's "labeled tags", where you may assign a tag for each option to be assigned to users.
    • The option to receive a posted copy of Alliance News must be configured by creating a consent form and then choosing it in the page settings under the option "Override default consent form". The headline of the consent form that you create will be the text that shows.
  • The FAQ section at the bottom of the become a member page is pulled from the children "included in the top nav" of the subpage of the become a member page with the slug "membership_form_footer_faq" - 🔹 please do not change the slug of this page.
    • The FAQs are limited to 3 - so if more than 3 are in the top nav, only the top 3 will show.
    • The icon image is pulled from the featured content slider of the FAQ child, the heading/question title is the headline, and the content is pulled from the content section.
    • The content below the FAQ columns is pulled from the content section of the "membership_form_footer_faq" page itself.
• The membership options page (step 2) is entirely hardcoded except for the summary below the membership options dropdown section which pulls from the page's content section.
• This functionality is the same as previously - i.e. each option on the membership options dropdown directs to a donation page that is uniquely made for the option - i.e. South Antrim Single yearly goes to the donation v2 page with the slug south_antrim_single_yearly.
• The payment page (step 3) simply includes the page's headline and the donation form itself - amounts can be configured in the form's backend.

👉 Action Center

• The action center is a basic page that will only act as an action center page if it is tagged with "action center".
• Each page that is tagged with "action card" will show as a card on the page. 
  • The types of page supported for these cards are signup, volunteer signup, donation v2, and petition.
  • Each card includes the page headline of the page below it, the paragraph text is the content section for signup and volunteer signup pages, and the "intro" content section for petition pages. The button links to the respective page of each action.

👉 People Pages

• A people page is any basic page that is tagged with the tag "people". 
• Each of the subpages of this page should be a category - i.e. a region or way to sort people - the headline of these subpages will be the heading for each category which pulls from the subpage's headline.
• Only the subpages that are included in the top nav will show - so for example if you have nobody to show for a region, simply remove it from the top nav.
• Each subpage of these region/category pages, is a person. 
  • Each person's image is pulled from the featured content slider of the person page (subpage) - the files do not need to uploaded to the parent page.
  • If there is more information to put above their name - then put this in the person's headline, otherwise, leave the headline black, and always put their name in the name field which will always show. 
  • The person page's content section is split into 6 sections with horizontal lines, and the data entered must always follow this order - 
    
    • 1 - Facebook Link 2 - Twitter Handle (do not use the actual Twitter link) 3 - Email Address 4 - LinkedIn link 5 - Phone Number 6 - Person Bio/Summary
    • If the person either doesn't have any of these, or doesn't want to provide them, simply put the AP's data to avoid dead links and broken layouts.
    • The bio will be added after the final horizontal line/page break following the phone number(s) and can be edited within the Content editor.
• If you want a person's page to have a map of the constituencies of Northern Ireland - simply add the tag "map" to the people page.
• If there is a map on the map - it will look for sections with ID's that contain the name of the region/constituency. These ID's are created from the slug of the region subpage - meaning, if you want to use the constituency map, then the region subpages must accurately have the name of the region in the slug - i.e. Magicians from South Belfast would have a slug of south_belfast_magicians so the map could read "south_belfast" from it.
• The dropdown next to the map does the same from each click, and the options on the dropdown are built from the children of the people page that are included in the top nav. 
  • The text to the left of the dropdown above the map is pulled from the content section of the people page.

👉 Vision/Policy Pages

• A vision or policy page is any basic page that is tagged with the tag "vision cards".
• This is so you may display modular content in a way that is not exactly a blog, but sort of looks like one.
• Each card on the page is a subpage included in the top nav of the vision page.
  • Each card links to the actual page of the vision/policy.
  • Each card has a background image which is pulled from the subpage's file attachments - it must have the suffix '-card' in the file name in order to show - this is done so we can reserve the featured content slider for a header image on the actual page of the card.
  • The page headline is the header text on the card, and page's content, truncated to 50 words is shown below this.

👉 Blog Post Pages

• The blog post features 2 different content sections in the back end - before the flip and after the flip.
• The before the flip section is split into 2 sections with a horizontal line - in the first section you put a subheadline, which will appear below the main headline on the blog post page. In the second section you put a caption for your header image.
• Underneath the subheadline and the date, the tags for this blog post will show.
• The header image is loaded via the post page's featured content slider - the rest of the input required for putting an image here is not coded to show, so don't worry about it.
• The "after the flip" content section is where the actual article content of your blog post will go. You can load basically anything here - text, images, video embeds, links to pdfs and other pages, etc.

 

Latest news 

To add a new article to latest news:

• To keep formatting, select a recent post and clone it with a suitable slug
• Find the cloned page under 'posts and subpages' and in settings>page settings, change the name, title, headline. Add/remove any tags and set the page to published. Change the date if necessary.
• In settings>social media, upload a suitable thumbnail image <2MB in size. Ideally this should be a rectangular image 
• In content, go to 'after the flip' and replace relevant text and images. Highlight image and and select 'insert/edit image' rather than deleting it