CMS Development

NRuppert
Member

Code upload issue

SOLVE

Hello. We have transferred our Website from Typo3 to the Hubspot Backend. We would like to change parts of the website in the HTML-Code and CSS-Sheets. When I try to update templates, themes, etc.(using the command "hs upload"),it doesn´t work. Even when I write something in the designer in Hubspot, changes are not applied.

 

Thanks and regards 

Ruppert

 

0 Upvotes
1 Accepted solution
Anton
Solution
Recognized Expert

Code upload issue

SOLVE

Hi @NRuppert

thank you for the insights. 

Wow. I'm sorry to hear that. That is not a great work by any means. What was your companys requirements? Was it the work of an official HubSpot partner(don't tell any names)? By default anybody who migrates a website from A to B should make sure that everything is working properly and the client(you) don't have to finish the work.

 

A few things to should check regarding the CLI:

  • is the correct portal set as default(if you have at least two, check the hubspot.config.yml file)
  • are you uploading it to the right folder/theme
  • you can use "hs watch [local theme/folder name] [HubSpot folder/theme name]" if you're in the local theme folder and have set the correct portal as default in the .yml file. VSCode or your IDE will show you a info-message that hs-watch won't upload anything... but this is "wrong". As soon as you save a file locally in a folder which is being watched - it will upload the file

 

And here some things to check in HubSpot:

  • Are the pages using the correct template from the theme(Settings tab of a page->advanced options->edit template)
  • are there CSS files at the very bottom of the Settings file connected? If so - they most likely overwrite ever other CSS file
  • Are CSS files defined in settings(cog-icon in the top right corner)->website->pages
  • if it's a theme(I assume it is) you can look at the base.html or so in the template folder for the loading order of the CSS file(s)
    • you know if it's a theme if the design-tool folder got a "brush" icon
    • it is listed in settings->website->themes

 

Also - the best loading order in my opinion for CSS is:

{{ require_css(get_asset_url('../../css/main.css')) }}
				{% if template_css %}
					{{ require_css(get_asset_url(template_css)) }}
				  {% endif %}
				{{ require_css(get_asset_url('../../css/theme.css')) }}

 

By doing so the main.css which contains the default theme styling informations that can't be changed via theme settings will be loaded first. After that optional template CSS files get loaded and the last file is the theme.css(or theme-override.css; naming is irrelevant). By doing so the theme.css will overwrite everything that might be set in the main or template file. 
Best practise opinion: The theme.css should contain only CSS information which can be changed via the theme options.

 

 

best, 

Anton

Anton Bujanowski Signature

View solution in original post

3 Replies 3
Anton
Recognized Expert

Code upload issue

SOLVE

Hi @NRuppert

how and what did you transfer from typo3 to HubSpot?

 

Does the CLI provide some kind of error or message?

 

Note: If you update drag&drop templates of a theme via CLI or Design-tools after you've modified them on page level no changes will be applied to the existing page.

 

Also: Look at the CSS if it's getting loaded in the correct order.

 

 

From an migration point of view:

In long terms it's always better to use a theme from a marketplace(fast release of a website possible) or create your own theme(better fit in terms of corporate design and maybe functionality). 

 

 

hope this helps, 

 

best, 

Anton

Anton Bujanowski Signature
NRuppert
Member

Code upload issue

SOLVE

Thanks for your help Anton. I will have a look at the CSS-Sheets.

 

The whole website was transferred by another compnay from Typo3 to the Hubspot Backend. I don´t know how to be honest.

 

After the transfer, it is our task to adapt our Site to our needs. 

 

The CLI doesn´t provide any message or error. It says that the upload succeded, but nothing happened.

 

With kind regards 

Ruppert

Anton
Solution
Recognized Expert

Code upload issue

SOLVE

Hi @NRuppert

thank you for the insights. 

Wow. I'm sorry to hear that. That is not a great work by any means. What was your companys requirements? Was it the work of an official HubSpot partner(don't tell any names)? By default anybody who migrates a website from A to B should make sure that everything is working properly and the client(you) don't have to finish the work.

 

A few things to should check regarding the CLI:

  • is the correct portal set as default(if you have at least two, check the hubspot.config.yml file)
  • are you uploading it to the right folder/theme
  • you can use "hs watch [local theme/folder name] [HubSpot folder/theme name]" if you're in the local theme folder and have set the correct portal as default in the .yml file. VSCode or your IDE will show you a info-message that hs-watch won't upload anything... but this is "wrong". As soon as you save a file locally in a folder which is being watched - it will upload the file

 

And here some things to check in HubSpot:

  • Are the pages using the correct template from the theme(Settings tab of a page->advanced options->edit template)
  • are there CSS files at the very bottom of the Settings file connected? If so - they most likely overwrite ever other CSS file
  • Are CSS files defined in settings(cog-icon in the top right corner)->website->pages
  • if it's a theme(I assume it is) you can look at the base.html or so in the template folder for the loading order of the CSS file(s)
    • you know if it's a theme if the design-tool folder got a "brush" icon
    • it is listed in settings->website->themes

 

Also - the best loading order in my opinion for CSS is:

{{ require_css(get_asset_url('../../css/main.css')) }}
				{% if template_css %}
					{{ require_css(get_asset_url(template_css)) }}
				  {% endif %}
				{{ require_css(get_asset_url('../../css/theme.css')) }}

 

By doing so the main.css which contains the default theme styling informations that can't be changed via theme settings will be loaded first. After that optional template CSS files get loaded and the last file is the theme.css(or theme-override.css; naming is irrelevant). By doing so the theme.css will overwrite everything that might be set in the main or template file. 
Best practise opinion: The theme.css should contain only CSS information which can be changed via the theme options.

 

 

best, 

Anton

Anton Bujanowski Signature