Skip to content

Using HS vs. our old WP site

To get the CC transfer to Hubspot (HS) done the fastest, we have to use HS as HS wants to be used.  Trying to force our existing WP site into HS as is will introduce many problems and time sinks.  They are just different cats.  It's ok.  It simply means we think about the site in HS terms - and build and organize our pages a little differently. 

First thing is setting up the general site the best way possible.  That's making a "child" theme bc you can't change the default HS themes.

Our theme is "Challenger Accelerator" (Not HS's "Accelerator.")

9106197.hs-sites.com

https://9106197.hs-sites.com/home

Unfortunately, once you create something, like a page, using a specific theme, you can't magically switch that page to another theme.  Basically, setting up your theme is the first thing to do, that is, if you want everything to look consistent.  Many of our HS "landing pages" were set up years back using the "Sessions" theme.  They still work bc Themes are cosmetic mostly, but there are some issues with mixing themes.  Basically, given that "global blocks" are off the table (more on that below), most of the recent work (using the HS Accelerator theme) is unneeded or not what we want.  

I've set up the following in the Challenger Accelerator theme.

  • A new Home Page
  • Page examples to CLONE (copy and change content / titles / SEO).  Several pages are also ready to use (needed to make some in order to get copyable layouts and make menus.)
  • Blog Index page.
  • Blog post examples.
  • Menus, CTAs, etc.

I've used the hierarchy terms in example page titles:

  • Home
  • Section
  • Category
  • Page

i.e. Home (Home) > Exam Prep (Section) > Emergency Medicine (Category) > EM Qualifying Exam Prep Course (Page).  This helps admin and creation of Menus.


"Global blocks" is now only the header and footer sections. 

The WP site had "global blocks" where you could have a single "block" of code - multiple sections, etc - place it wherever and edit it in one place.  THAT IS GONE - at least the way HS does things.

HS only has global blocks (complex text and layout chunk) as a "custom module."  HOWEVER - modules are intended for coded dynamic elements that do something - not just HTML text or inserts.  You don't get any visual editing with custom modules. And that is not helpful if we want everything easy for all. 

So... forget what the WP looked like, how it was set up or functioned.... It's Hubspot time. Everything needs a redo. Pages, forms, menus, blog subscriptions, etc.

We are going back to a standard Web Site approach where there is ONE page for specific information as needed.

If you need to mention that info, you WON'T insert a "global block" - you'll link to THE page specific (there's a page search tool) to that page (or to the APP portal, store, login, etc).  With ONE page for specific needs, when you want to place a link in copy, you can quickly search for and select an existing page for your link using HS.

Example... I have placed all the "Lifelong Benefits" - "Multiple way to Learn" - "Premium membership hype" WP global block content on ONE webpage for "Med-Challenger Benefits, Features, and Value."  One page per need.  The HS link insert feature allows you to search for and pick an existing HS page or enter an outside URL (i.e. portal).  

Note - there ARE some globally-managed items (NOT custom modules) that, once set up, can be used anywhere (they update everywhere and thus prevent rogue URL breaks) - Commonly used one are:

  • CTAs (call to action) buttons - Need a button for Get Started for Free, View Benefits, Subscribe, See All Courses, etc?  Use a CTA module. Once placed, you tell the module which globally-managed CTA to display.

  • Forms - Form modules allow you to pick an existing HS form to display. You don't need to embed form code on a specific page. 

  • Menus - Need to list out all EM courses?  Don't make a bunch of single buttons, make a menu for our common product / page groupings and use them.  


 

There are specific page types in HS

Each page type in HP has an intended use in HS, so it matters what type you make.

WP had two types of pages (page and post). It didn't really matter outside of some SEO tidbits and that posts would display in "recent post" elements.

HS is different.  They have defined page types, each with specific intent.

Be specific when discussing "pages" internally - a "webpage" is DIFFERENT than a "landing page", "blog post" or "help article."  (A Theme is also not a template. A Template is not a "finished example page to copy.")

Web pages

  • used for main company site info, product spreads, category pages, etc
  • uses visual editor
  • access to all fancy modules (accordions, recent posts, forms, etc)
  • settings for URL, meta description, featured images

Landing pages

  • used for lead capture endpoints - from an ad, email, etc
  • uses visual editor
  • access to fancy modules (accordions, recent posts, forms, etc)
  • settings for URL, meta description, featured images

Blog posts

  • news articles and other one-off announcements, sales, QQ, cases, new content posts
  • these are for our blog subscription - i.e. they impact our EMAIL subscribers
  • uses visual editor - but post content is ONE big section.  You can't add sections like you can on web / landing pages.
    • This sorta changes our QQ and Case Q&A blog forms, but I've set up some blog examples.
    • Heck, everything is new slate. It might actually help grow sign ups if we stop providing QQ answers in posts. Tease it. Make them play online. :-)
  • ONLY access to basic visual editing, insertion of global CTA's, tables, images, video.  NO fancy modules.
  • settings for URL, meta description, featured images

Support Articles

  • these are the FAQs and support articles at support.challengercme.com
  • If someone needs to know how stuff works, send them to support.challengercme.com
  • If you find yourself RE-TYPING existing how-to info... stop and link to the existing ONE page

 

I have made HS-based "*example-pages" for production

You'll see the internal page names start with SECTION, CATEGORY, or PRODUCT

Pages titled "CLONE-ME" are example layouts to copy - or just clone a page similar to your needs. 

Clone - is how you copy a page in its entirety to a new instance.  The trick to production is developing the "page layouts" for our common page needs.  I'm calling these "page examples" (pre-constructed layouts) because the words "page template" is something else in HS.

I have made several webpage example layouts using all default elements titled e.g. *CLONE-ME-example-product-page. One for a single product, an array/category, etc

  • IMPORTANT - Change the SETTINGS for Page Title, URL, metadata.  I found HS will make a nice url from your Page Title if you copy the Title into the URL field.  
  • Then you can edit the CONTENT using the visual editor. 
    • Webpages are for products, categories, home, other website "template" pages like About Us, Recent Projects, etc.
    • Landing pages - none - we have several active. Only FYI is... They were made in 2001 using the "Sessions" theme - so they look different from "Challenger Accelerator."  Ugh.  You CAN'T switch a page's THEME once it's started. So, we'll live with it.  It's largely cosmetic.  HS's modules and CRM functions don't care about theme.  
    • Blog posts (blank, for exam info blogs, QQ/Case of Weeks)
    • Help articles are accessed and cloned via Support section.

    Check / change the page SETTINGS (tab) - main things to admin are : the internal name (some name for us only), the SEO page TITLE, the URL, and the SEO Meta Description. There are featured images, etc but that's bonus SEO dress up, not the SEO essentials.


 

HS terms.... themes, templates, and page types

Use the theme "Challenger Accelerator"

"Challenger Accelerator" is our own "child" copy of the HS Accelerator theme and it allows us to change anything we want.  HS keeps their default theme locked.

HS themes are the global styles that affect all default elements.  There are default THEME settings for drop-in elements like text, headings, buttons, etc.  

HS templates are like "page frameworks" - Blank, Blog, About Us, etc.  Templates are NOT "example page layouts."  

To keep things looking consistent, the goal is to use as LITTLE custom styling as possible.  Thus, if we ever want to increase the size of a certain font everywhere, we can (if we're consistent in default style use).  



 

Menus (links for page / items lists)

Menus (like most modules) are their own saved items - and they work like global objects. 

A menu is a module - you place a Menu module - then you pick WHAT menu to display in that spot.  Menus can be added to any webpage or landing page.  You manage the items in the menu globally.  So, once your pages are ready (e.g. all STATE CME pages per state), make a MENU to display all 50 state CME links.)

Don't make in-page button or link lists for multiple products or every state CME page.  Make a menu.  We can have menus for EM products, FM products, etc. and place the ONE menu wherever you need.  

Again... ONE item for each need.  Don't remake a separate XYZ wheel.  Use the one XYZ wheel you already have.


 

CTAs (links for page / items lists)

CTAs (like most modules) are their own saved items - and they work like global objects. 

A CTA is a module - you place a CTA module - then you pick WHAT CTA to display in that spot.  CTAs can be added to any webpage or landing page.  You manage the items in the CTAs globally.  

CTAs can be applied to email templates and more. And they can be attached to campaigns and tracked.

Use a CTA to set a button for a common action (Login, See EM courses) - or take people to a common destination.  I've made individual CTA "Free Trial" and "Buy Now" buttons for several products.  You'll see them when you place or edit a CTA. CTA's are global so they really help avoid link-by-link admin and rogue 404s.

Again... ONE item for each need.  Don't remake a separate XYZ wheel.  Use the one XYZ wheel you already have.


 

Text formats (note when transferring text from WP site)

Check your site copy/paste transfers, especially texts. Clean up / remove rogue formats.

Grabbing texts, tables, etc from WP can bring over some rogue styles. We want clean content and to use our HS theme defaults for consistent styling.

CLEAR FORMATTING of ANY TEXT YOU PASTE IN FROM WP.  Apply HS theme styles from the dropdown

Example: Sometimes text will transfer over creating a <Div> tag (instead of a <p> tag) and it will look a bit off, different line spacing, etc. In your WYSIWYG tools, you'll notice the tags are not set to the desired HS theme default. Just hover over the <Div> section text and select the default paragraph <p> tag using your editor tools.

I was using 1.75 for paragraph text line spacing.  Arial font.


 

Other HS elements to address for switch

There are a lot of pages to replicate in the new HS form, but it's also systemic change to communications, email, etc.

  • Blog post subscription and email delivery options (current WP emails use a paid plugin)
  • Products in HS - our product list (objects) has ID, titles, and prices, but no descriptions
  • Product objects can be used in HS email automations.
  • Potentially move the "store" and purchasing?  Just saying...

Everything in HS is designed for SEO, GA, traffic, leads, and tracking / reporting everything.  We've always wanted good automations - and reliable tracking on conversions.


 

 

Special Cases

Global info snippets - say, if you need to place an alert atop all pages for sales.

  • The text box code below is a marginless <span> for sales info.
  • Place a text box in the website header or footer (global objects) to place something on ALL webpages (or pages that share the same THEME)
  • To keep this nice and compact, don't use any "format" code like <p>'s in the code because those tags apply theme-defined margins and will add extra space, FYI
Special Offer - Something as a global alert.