It’s been a big month for CMS Hub Free! We’ve added a ton of features to CMS Hub Free including—1 blog (up to 100 blog posts), 25 landing pages, and 1 subdomain and 1 CCTLD on 1 root domain.
To support you all, we’ve gathered product experts and HubSpot power users from across the world to help answer all your CMS Hub Free Tools questions!
We have members of the HubSpot product, developer, support, and success team here to answer any questions you might have.
AJ LaPorte: Sr CMS Hub Developer Advocate
Jon McLaren: Sr CMS Hub Developer Advocate
Katie Tade: Senior Product Manager
Lukas Pleva: CMS Hub Product Lead
Luke Summerfield: Product Go To Market Lead
William Spiro: Senior Product Manager
Please drop in your questions below. We’ll start answering questions on July 12th and until 3 PM EST on July 15th.
Great question and thanks for adding an example! Because navigation bars have more complex collapsing behavior when viewed on mobile (you’ll often see them collapse into a “hamburger menu”), they tend to have less flexibility with the way they’re formatted. Because of that, your best bet for achieving the layout with the logo on top that also collapses elegantly on mobile will be to have a developer custom code it for you.
If you find a theme on the marketplace that you like, the creators of the theme sometimes offer extra paid services to add custom features (like a more customized navigation) if you contact them. If you’re looking to do a larger amount of custom work, you could also hire a HubSpot certified partner through our partner directory here.
In the meantime, we’re also working on more ways for themes to offer a few different navigation layout options so that you can easily pick your favorite layout and set it quickly, so keep an eye out for that in the future!
How can we determine which keywords people are using to find us?
As we know after google started encrypting search result, we lost the ability to see exactly which keywords were driving vistits ti our site, but we would like to find some ways to get some of this insight to helo olan the So we are using Google Search Console to find some specific queries thar people are using to find our site and how many clicks each is recieving.
Also we are looking for a best way to use Hubspot´s traffic analytics tool to view website traffic data. We have some external site but most of our sites are hubspot pages, we find there are so may unknow keywords(SSL) and unknown keywords, anyway to find those keywords?
Your best option for finding which keywords people are using is to make use of Google Search Console. As you stated, back in September 2013, Google made a change that encrypts the search results for its users causing web analytic packages (such as HubSpot) to not be able to identify the keywords that generate organic search traffic.
As for the best way to use our traffic analytics tool, that is a more in depth question and depends on what you are trying to report on. Here is our knowledge base article about our traffic analytics tool which should help point you in the correct direction: Analyze your site traffic with web traffic analytics
Thanks for your question! I would first recommend checking out our module marketplace to see if there are any modules there that would have a similar look and functionality in your example. If you search for “tabber” modules in the marketplace, there are a few that I think will be similar to what you’re looking for! If you’re looking to match the example you posted exactly and you find a module on the marketplace that’s similar, the creators of the modules sometimes offer extra paid services to add custom features or styling if you contact them.
HubSpot’s default theme, the Growth theme, also offers a tabs module that’s also similar to what you posted, so if you’re using the Growth theme, you can try that out!
Hi, I am trying to get our listing page to filter properly. I am currently using isotope.js, which is functioning properly, however the loop seems to be applying the same item slug on every post item. So when applying a filter, it shows the same results as “all.” Is there a way to apply the correct slug to each post? Here is my loop code:
Hey @54Brands the problem stems from looping through each tag, then looping through every post, and adding the current tag you’re looping through to every post’s item. This means you’ll only add one tag’s slug to that div element, and you will also render the same post’s html to the page 20 times.
If you had 100 blog posts, you would be rendering 2,000 post-item divs to the page, just to make it so you can filter 100 posts. I would propose instead just rendering 100 post-item divs for the posts and filtering those.
This is where the code needs some updates:
...
{% set my_tags = blog_tags('default', 20) %} {# grab 20 tags from the default blog #}
{% set posts = blog_recent_posts('default', 100 ) %} {# grab 100 of the most recent posts from default blog regardless of their topic #}
{% for item in my_tags %} {# for each tag in the list of 20 tags #}
{% for post in posts %} {# for each post in the list of 100 posts regardless of their tag #}
{% if loop.index > 1 %} {# skip the first post out of 100 #}
<div class="post-item {{ item.slug }}"> {# add the current tag's slug to the div. It will be the same for every post in this loop because we're looping through every tag and then re-looping through every post for each tag. #}
...
Haven’t used isotopejs but there’s definitely an easier and more efficient way to get accurate tags on every post’s div so you can hide/show them.
Based on isotope’s documentation here: Isotope · Filtering
You should be able to do this just by adding all of the topic slugs to each of the 100 posts.
So your code would look more like this:
<div class="post-listing isotope">
{% set posts = blog_recent_posts('default', 100 ) %} {# grab 100 of the most recent posts from default blog regardless of their topic #}
{% for post in posts %} {# for each post in the list of 100 posts regardless of their tag #}
{% if loop.index > 1 %} {# skip the first post out of 100 #}
{% set post_tag_slugs = [] %}
{% for tag in post.topic_list %}
{% do post_tag_slugs.append(tag.slug) %}
{% endfor %}
<div class="post-item {% for tag_slug in post_tag_slugs %}{{ tag_slug }} {% endfor %}"> {# add all of the topic slugs for all of the topics this post is in #}
<article class="blog-index__post-wrapper">
<div class="blog-index__post">
{% if post.post_list_summary_featured_image %}
<a class="blog-index__post-image" href="{{ post.absolute_url }}">
<img src="{{ post.post_list_summary_featured_image }}" class="" alt="{{ post.featured_image_alt_text | escape }}">
</a>
{% endif %}
<div class="blog-index__post-content">
<div>
{% set featured_tag = post.topic_list | first %}
{% if featured_tag %}
<span class="blog-index__post-preheader">{{ featured_tag }}</span>
{% endif %}
<h3><a href="{{ post.absolute_url }}">{{ post.name }}</a></h3>
{% if content_group.show_summary_in_listing %}
<p>{{ post.meta_description | default(post.post_summary, true) | truncatehtml(150, '...', false) }}</p>
{% endif %}
</div>
<a class="more-link" href="{{ post.absolute_url }}">Read More</a>
</div>
</div>
</article>
</div>
{% endif %}
{% endfor %}
</div>
Then all of your topics are in the post-item element’s class list and you can hide/show items based on that.
Positive side effect aside from performance - if you plan to do any sorting with isotope it will visually look better/make more sense this way to the user.
Happy Coding!
The first is how to send follow-up emails at time-based increments based on their last known login, but not send them the same email twice. For example, if a customer has not logged in for 30 days, they get email V1, if they go another 30 days but have received email V1 we then send them email V2, and so on. I started a workflow of if/then, but having a little uncertainty if that’s the best route to go. Your assistance would be appreciated.
The second need is how to mark certain customers as ‘non-marketing’ and get them to NOT be included in our newsletter list, per this post here. We had an awkward situation recently and I’m still trying to figure out how it happened, and how to fix it, per my reply post linked below.
Hello, thank you for the oppurtintym I would like to know how could I set up a simple and easy Panel with only few items as inventory a calendar schedule and clients archive;
Could you go into more detail about what you are trying to accomplish? Is this something that you want to use the HubSpot CMS to accomplish? As many details as you can provide will help us deliver a more valuable answer
Sure. So right now if I drag a module into the page it drops it inside of a section, row or column (depending on other elements)… I’m asking if there can be an ID and or a class field that would place a class or an ID on the element in the options area of the section editable sidebar same place that we have visibility and alignment options.
while playing with a free CMS Hub account I’ve discovered the branding wizard and “page wizard” while going through the CMS Hub checklist. This feature blew my mind. This feature eliminates the creation time for a basic setup almost completly.
But this got me thinking
1. Is there a way to show custom theme configuration settings in the wizard? I mean sure, there are the theme settings(Settings/Website/Theme…) where the client/user can modify every bit of a bought/custom theme at any time but I’m thinking more from the theme provider/partner side. So that somebody who creates a custom/marketplace theme can select options - maybe through the fields.json of the theme - which options should/could be set with the branding wizard.
2. The “select your category and you’ll see different pictures” and the “select from one of those layout for this particular page” feature ->. Is there a way that a developer can predefine those settings? I mean this is basically a choice-field - if a developer could write something like
{% if branding_wizard.category == "x"%}
{% set header = "../globals/header_a.html" %}
{% set about = "../sections/about_a.html" %}
{% set footer = "../globals/footer_a.html" %}
{% if branding_wizard.category == "y"%}
{% set header = "../globals/header_b.html" %}
{% set about = "../sections/about_b.html" %}
{% set footer = "../globals/footer_b.html" %}
{% endif %}
it would be huge.
3. Is there a way to predefine those styling categories (clear, bold, classic…) in the wizard directly in the theme? This would give developers so much options and - wouldn’t overcomplicate things for the client/user. Maybe through providing a specific file/json(or even though the theme-override.css) for this where the options will be defined like
{% if branding_wizard.styling_categories == "bold" %}
{% set first_color = "#ccc" %}
{% set font_family = "'Lato', Arial, sans-serif" %}
{% if branding_wizard.styling_categories == "classic" %}
{% set first_color = "#020" %}
{% set font_family = "'Futura', Arial, sans-serif" %}
{% endif %}
Hi @Anton! So great to hear you’re a fan of the setup wizard. We created it for the exact reason you mentioned - to enable marketers new to CMS Hub (especially the free tier and CMS Hub Starter) to create a new website as quickly as possible.
Right now, the simplified wizard flows are only available if the user selects the Growth theme. But we’re actively working on supporting custom and Marketplace themes as well! For example, up until a few weeks ago, if the user selected a theme other than the Growth theme, the “Customize your theme’s settings” step wouldn’t be available. With recent changes, the step is available regardless of what theme you select, but it works differently depending on if the user selected the Growth theme or another theme. For Growth, we send you into the simplified wizard you mentioned. For other themes, we send the user into the Theme Settings app and give a short tour of the different parts of the app.
Long-term, though, we definitely want the experience to be consistent. We’re only at the beginning of exploring what that might look like, but many of the things you’ve suggested have been put on the table as options to explore further. Will definitely keep you posted on how this progresses!
— Jaycee
. Is there a way that a developer can predefine those settings? I mean this is basically a choice-field - if a developer could write something like