CMS Development

rdecker
Member

editor / live detection?

SOLVE

Hello everyone!

Is there a HubL way to create a if statement that detects if the User is editing a blog post in the editor or if a user has opened the live version of the blog post.
I was unable to find this on Google or in any of the hubspot docs.

The reason I need this is that I want do display different code in the editor compared to the live blog post.

 

Thanks!

0 Upvotes
1 Accepted solution
Solution
Anonymous
Not applicable

editor / live detection?

SOLVE

The editor iframes the content in on the preview side.... something like this should do the trick: 

{% if request.full_url is string_containing "preview.hs-sites.com/content-rendering/" %}
    //this would only display within the content editor
{% else %}
    //this would show everywhere but the content editor 
{% endif %}

--
Bryan Schneidewind
Manager of Web Development
Weidert Group

View solution in original post

5 Replies 5
Solution
Anonymous
Not applicable

editor / live detection?

SOLVE

The editor iframes the content in on the preview side.... something like this should do the trick: 

{% if request.full_url is string_containing "preview.hs-sites.com/content-rendering/" %}
    //this would only display within the content editor
{% else %}
    //this would show everywhere but the content editor 
{% endif %}

--
Bryan Schneidewind
Manager of Web Development
Weidert Group

rdecker
Member

editor / live detection?

SOLVE

ah, that looks promising Bryan!

 

Thanks a lot, I will try that.

rdecker
Member

editor / live detection?

SOLVE

Bryan, your solution did work!

The iframe URL did not contain "/content-rendering/", but after adapting that it worked perfectly fine.

 

Thanks!

0 Upvotes
Stephanie-OG
Key Advisor

editor / live detection?

SOLVE

I don't think there's HubL to do this but I usually use CSS as the editor has a hs-inline-edit body class. 

 

I just wrote a quick post about this here (I don't think it's the best post I've ever written so let me know if it doesn't make sense). 

 


Stephanie O'Gay Garcia

HubSpot CMS Design & Development

Website | Contact

 

If this helped, please mark it as the solution to your question, thanks!

0 Upvotes
rdecker
Member

editor / live detection?

SOLVE

Thanks Stephanie,

 

I already thought about using Javascript to detect the editor by checking the browser URL (your way is better though).

But that would lead to a lot of unnecessary, invisible HTML Code in my case.

 

My customers design draft for the blog listing page displays blog posts as boxes with image, headline and teaser, but also has several other types of editable boxes that should show up in between blog post boxes and on other parts of the listing page.

 

For normal blog posts that design works perfectly well, but the other types of boxes are a bit of an issue.

My idea was to make all types of boxes "blog posts" so a person can edit the content without having to edit the templates.
And it would be impossible to add boxes somewhere in the post listing for loop any other way. 

 

By tagging posts with different types of tags (like "product", "externalLink, ...) I could then display different HTML Code for a box that is not a normal blog post on the listing page, depending on what tag is set for the post.
That would not lead to invisible code on the listing page, but if I want the person editing the box/blog post to see the content as it would appear ont he listing page, I would have to add HTML code for all types of boxes (in addition to the normal blog post code) to the blog post templates and then only show the part for the specific content type.

 

The customer is used to being flexible with layouts from using a enterprise CMS system, but Hubspot is not flexible at all 🙂
At least the blog isn't.

 

Anyway, if there is no editor HubL detection I will have to go the JS way.

 

Best regards!

Rene

0 Upvotes