Building BEYOND website

Use "Navigator" on the right to quickly scroll through sections of this document, or see this list again.

If you can't see screen shot easily

Most of the raw data is coming from Airtable.

Table names prefixed with "💥" are used for website building.

Table names prefixed with "⌘ ctrl" are control tables used for website building.

Each of these tables will have a "webAPI" view – please never rename it.

"Build Tool" brings all this together, and publishes the whole website – using the latest Airtable information.

Order in which the site is built:

1. BEYOND Partners
   Partners logos and links are omnipresent on every page, so they're built first
2. Footer Links
   A mini map to all sections of the website, also on every page
3. WordPress pages
   Manually created WordPress pages that need new footer
4. Speakers
   Carousel of featured speakers, followed by the full list of speakers
5. Schedule
   
6. Showcase
   Carousel of featured projects, followed by the full list of projects

Useful tools

To crop, convert and do basic colour manipulation use Apple's built-in Preview.app

To optimise images, use (free) ImageOptim.app, available from https://imageoptim.com/mac

To do pretty advanced (but free) Photoshop work, use https://www.photopea.com/

Partners

Partners will appear in the scrolling footer of every page.

1. Initial setup of Partners
   Sam & Tara
   1. Open
      BEYOND 2024 base
      💥 BEYOND Partners
      webAPI view
      
   2. Most basic info required
      
      
      name
      which will be shown on HOVER and/or read out to user
      
      
      webStatus
      needs to be
      Publish
      or
      Live
      to be included in the next build run.
      
      
      img
      needs to be
      white
      on
      transparent
      background, saved as optimised
      PNG
      file.
      
      
      Crop
      image tightly within pixel – this will ensure that logo is equal height in ticking footer, regardless of its actual ratio.
      
      orgURL
      will be used when user clicks on it,
      
      
      but you can override it with
      b24URL
      which should take you to a specific Beyond 24 page on their website
      
      
      Partnership Type
      will be used for grouping of partners
2. Open, login and run
   Build Tool

3. In build there is a counter of how many partners there are.
   Moving or clicking on segments will show you Partner's name, and a direct link to its Airtable record for confirmation or adjustment.

   
4. When build process is finished, this is how the
   Partner Link
   will look.
   

Footer links

A mini map to all sections of the website, part of the footer, also on every page

1. Initial setup of Footer links
   Sam
   1. Open
      BEYOND 2024 base
      ⌘ ctrlFooterMoreInfo
      webAPI view
      
   2. Most basic info required
      
      
      name
      of the Footer link
      
      
      link
      Most will be relative to
      beyondconference.org
      domain, so most links will start with
      /
      (forward slash) denoting current domain
      
      
      order
      let's you change the order of link. Use increment of 10. You can quickly change the order by -1 or +1 value closest to the increment.
      
      
      rgb
      will show you a list of standard BEYOND colours to use.
2. Open, login and run
   Build Tool

3. In build there is a counter of how many Footer links there are.
   Moving or clicking on segments will show you name and url, and a direct link to its Airtable record for confirmation or adjustment.

   
4. When build process is finished, this is how the
   Footer links
   will look.
   

WordPress pages

Manually created WordPress pages that need a new dynamic footer

1. Initial setup of WordPress custom pages – content not coming out of the Airtable yet.
   Sam & Vuk
   1. Open
      https://beyondconference.org/wp-admin/
      to check and manage WordPress pages
   2. Pages should be built using
      DIVI
      visual editor
      
      
      Focus on
      content
      first, and then
      design later
      .
      
      There is
      no need
      for any footer hooks or code.
2. Open, login and run
   Build Tool

3. In build there is a counter of how many WordPress pages there are.
   

   
4. Some Page
   with
   checked
   checkbox denotes that page
   will
   receive a new updated footer.
   
   
   Other Page
   with
   unchecked
   checkbox denotes that page
   will NOT
   receive a new updated footer.
   
   
   Click
   on the page name to
   load, open and check
   it.
5. When build process is finished, checked
   WordPress pages
   will have the new latest footer.
   

Contacts (aka) Spreakers

1. Initial setup of Contact (Speaker)
   CET
   1. Open
      BEYOND 2024 base
      💥 Contacts table
      webAPI view
   2. Most basic info required
      Name
      and
      email
   3. Tick checkbox
      allowUserEdit
      which will generate a unique
      Editing Invite
      link
   4. Send email to contact with:
      Editing Invite
      link
2. User changes their details
   Client
   1. User Edit
      When user sends their details in filled out form
      1. Chele
         an email notification will be sent to Chele with a link to the Speaker in Airtable
      2. Untick checkbox
         allowUserEdit
         which will stop user reusing issued
         Editing Invite
         link
         
         
         
      3. Use Airtable interface to check what has changed.
         
         
         In COMMENTS, select
         All activity
         or
         Revision history
         
         
         
      4. Check contents of
         img
         field
      1. Change
         webStatus
         from
         User Edit
         to
         Review
   2. Review
      Check specifics of Speaker record
      1. Anna & Holly
         an email notification will be sent to Holly or Anna with a link to the Speaker in Airtable
      2. Final checks of
         name
         ,
         jobTitle
         ,
         organisation
         and
         bio(graphy)
   3. Change
      webStatus
      from
      Review
      to
      Publish
      1. Crucial information is missing, or incorrectly supplied.
      2. Tick checkbox
         allowUserEdit
         which will generate a unique
         Editing Invite
         link
      3. Send email to contact with:
         Editing Invite
         link
         with explanation and request for missing data.
3. Open, login and run
   Build Tool

4. In build there is a counter of how many Speakers will be published.
   Moving or clicking on segments will show you their name and link to their session, if available. They're direct links to Airtable record for confirmation or adjustment.
   Warning icon warns you that there is no session in Schedule associated with this speaker.

   
5. 
   When speaker has already been
   published
   , but has edited their record in the meantime, it needs to go through
   reviewing
   process first.
   
   
   Currently build tool will still work, but will omit the edited user.
   
   
   Click on
   USER EDIT ➜
   to review the speaker and change
   webStatus
   to
   Publish
   
   Press
   CMD
   R
   to refresh Build Tool
   

6. If there are trailing spaces left in Names (First Name or Last Name), they will be automatically corrected when published.

   
7. When build process is finished, checked
   WordPress pages
   will have the new latest footer.
   

Final touches

1. Build Tool takes about 1 second per page, so 60 pages ≈ 1 minute of time.
   This speed varies depending on your internet speed, server loads and speeds – so speed will vary, but not more than a few minutes for the whole process.

   
2. Make sure to
   Refresh (Server) Caches
   first
   
   
   
   Clicking on it will take you to WordPress, make sure to have your login details handy.
   
   
   
   Click on
   Clear all caches
   button
   
   
   
   
   
   Close
   the WordPress window.
   You can use shortcut

   CMD

   W
   
   
3. Finally check the website
   
   Clicking on it will open the Home page
   
   
   
   Make sure to refresh your
   Local Cache
   in your browser.
   Most will work with shortcut

   Shift

   CMD

   R