topic Re: CMS Hub Free Tools Ask Me Anything (July 12th) — Now Live 🎉 in CMS Development

(CLOSED) CMS Hub Free Tools Ask Me Anything (July 12th)

Jaycee_Lewis — Mon, 18 Jul 2022 14:05:07 GMT

Hey, HubSpot Community 🧡

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.

Looking forward to hearing from you all soon!

Re: CMS Hub Ask Me Anything (July 12th) — Now Live 🎉

llopot — Tue, 12 Jul 2022 18:14:12 GMT

Hi, am a new student. Am very pleased to be here, am looking forward to growth, change and walking a differnt career path.

Re: CMS Hub Ask Me Anything (July 12th) — Now Live 🎉

Jaycee_Lewis — Tue, 12 Jul 2022 20:30:26 GMT

Welcome to the community, @llopot 👋 — Jaycee

Re: CMS Hub Ask Me Anything (July 12th) — Now Live 🎉

hányü — Wed, 13 Jul 2022 07:13:43 GMT

Hi there everyone, happy to be here! 🙂

i am wondering how to create a navbar with the logo centered above the navbar. ps: place the logo above the navbar links. Here is an example:

I can't seem to find any examples of this achieved in Hubspot templates in marketplace. Anyone know the best way to acheive this?

Thank you!

Re: CMS Hub Ask Me Anything (July 12th) — Now Live 🎉

hányü — Wed, 13 Jul 2022 07:44:49 GMT

Hi there,

One question about SEO.

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?

Thank you:)

Re: CMS Hub Ask Me Anything (July 12th) — Now Live 🎉

ESobey — Wed, 13 Jul 2022 11:04:33 GMT

I was if there is a feature in hubspot in which you can add to the landing page, like a menu bar which you click and goes between different sections.

Re: CMS Hub Ask Me Anything (July 12th) — Now Live 🎉

54Brands — Wed, 13 Jul 2022 13:52:51 GMT

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:

<div class="post-listing isotope"> {% set my_tags = blog_tags('default', 20) %} {% set posts = blog_recent_posts('default', 100 ) %} {% for item in my_tags %} {% for post in posts %} {% if loop.index > 1 %} <div class="post-item {{ item.slug }}"> <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 %} {% endfor %} </div>

Re: CMS Hub Ask Me Anything (July 12th) — Now Live 🎉

katie — Wed, 13 Jul 2022 15:11:51 GMT

Hi @hányü,

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!

I hope this helps! Happy building!
Katie

Re: CMS Hub Ask Me Anything (July 12th) — Now Live 🎉

jmclaren — Thu, 14 Jul 2022 13:05:35 GMT

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: https://isotope.metafizzy.co/filtering.html

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!

Re: CMS Hub Ask Me Anything (July 12th) — Now Live 🎉

AJLaPorte — Wed, 13 Jul 2022 18:06:47 GMT

Hello Hányü,

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: https://knowledge.hubspot.com/reports/analyze-your-site-traffic-with-the-traffic-analytics-tool

-AJ

Re: CMS Hub Ask Me Anything (July 12th) — Now Live 🎉

katie — Wed, 13 Jul 2022 18:58:16 GMT

Hi @ESobey,

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!

I hope this helps! Good luck with your website building!

Katie

Re: CMS Hub Free Tools Ask Me Anything (July 12th) — Now Live 🎉

robertkreisler — Thu, 14 Jul 2022 13:44:42 GMT

Hello!

We have a couple issues that I need help with.

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.

Mark Contacts as Non-Marketing

Thanks in advance!

Re: CMS Hub Free Tools Ask Me Anything (July 12th) — Now Live 🎉

dennisedson — Thu, 14 Jul 2022 17:16:45 GMT

@Anton , I know you have started building a site with the CMS Free Tools. Any thoughts or questions you have about using it so far?

Re: CMS Hub Free Tools Ask Me Anything (July 12th) — Now Live 🎉

Balthatek — Thu, 14 Jul 2022 20:09:57 GMT

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;

Re: CMS Hub Free Tools Ask Me Anything (July 12th) — Now Live 🎉

Anton — Fri, 15 Jul 2022 18:04:35 GMT

Hey folks,

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 %}

Thank you!

best,

Anton

Re: CMS Hub Free Tools Ask Me Anything (July 12th) — Now Live 🎉

ontarget — Fri, 15 Jul 2022 13:19:00 GMT

Is ther ever going to be support for ids and classes on drag and drop sections, rows and columns?

Thanks.

Re: CMS Hub Free Tools Ask Me Anything (July 12th) — Now Live 🎉

dennisedson — Fri, 15 Jul 2022 14:40:33 GMT

@Balthatek ,

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 😀

Re: CMS Hub Free Tools Ask Me Anything (July 12th) — Now Live 🎉

ontarget — Fri, 15 Jul 2022 14:44:46 GMT

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.

Re: CMS Hub Free Tools Ask Me Anything (July 12th) — Now Live 🎉

katie — Fri, 15 Jul 2022 15:40:40 GMT

Hi @ontarget ,

Thanks for posting! We do currently allow you to add classes to developer-built sections (more info on that here), so if you're building out sections in your theme, that option is available.

So far, we've resisted introducing the option to add classes and IDs to containers from the page editor because of the volatility that it introduces in the context of drag and drop. Adding classes to containers that can be moved around on the page runs the risk of the styling on that container breaking without the content creator knowing the reason behind the breakage.

It's definitely something we're still considering, but if we do introduce it in the future, we want to be cautious about how it's used to best help content creators achieve the look they want with minimal risk of breakage.

I hope this helps! I would definitely recommend checking out the new developer-build sections feature if you haven't already!

Katie

Re: CMS Hub Free Tools Ask Me Anything (July 12th) — Now Live 🎉

jorcrus — Fri, 15 Jul 2022 16:31:24 GMT

Hello there!

Is there a way to create a filtered list of blog posts based on 2 or more tags/topics without breaking the pagination? Is this feature something you think could be added in the future?