â–Ľ
Streaming live at 10am (PST)

Website CSS broken

Hi,

www.abbiemasoncircus.com and abbiemasoncircus.com are loading differently. I have cleared cache and history and it is happening on my partners laptop too. On one, the correct css is loading and the other it is not.

I am re-uploading this website after having made changes to it in Webflow. It was working correctly before.

Here is the webflow link

Here is the share-only link
https://preview.webflow.com/preview/abbi-mason?utm_medium=preview_link&utm_source=designer&utm_content=abbi-mason&preview=276f365b37aef221d22f0568ece5ee97&mode=preview

Any ideas on how to fix this would be greatly appreciated.

Thank you!

Welcome to the community @runaway703!

That’s strange, where is it you’re hosting your project? I do notice that you’re live sites don’t include SSL, however I can’t say whether or not that would cause the issue.

Looks like it’s working on my end now, did you happen to make some changes on your end?

Thank you!

It appears to be working on Chrome and Microsoft Edge, but it seems to be still broken on Safari, Firefox.

I haven’t included an SSL for this project, I am new to web design and this is my first live project. I haven’t got around to figuring out SSL yet. It was working before the re-upload with out it so I don’t think it is an issue.

for me, the www.abbiemasoncircus.com link works but the abbiemasoncircus.com still doesn’t (on Chrome) but when I type it into the search box they both work…

for me, the www.abbiemasoncircus.com link works but the abbiemasoncircus.com still doesn’t (on Chrome) but when I type it into the search box they both work

It’s looking like both sites redirect to the non-www version, but this is working for me on both Chrome and Firefox. Keep in mind you may need to do a “hard refresh” (hold shift while reloading the page) but I’m guessing any issues you’re noticing are just due to caching.

As far as SSL, depending on where you’re hosting the site it may be included but I would strongly recommend taking the steps to get this enabled. Most providers offer some form of it for free, with paid options for more robust, feature-rich SSL but without knowing your situation I can’t say for sure.

Oh, that worked! I wasn’t aware that you could hard refresh like that, thank you. How would you do a hard refresh on a mobile? What about those who have loaded the website elsewhere?

The website is hosted on Bluehost. I am not sure what their SSL policy is. I was briefly looking into adding an SSL although I couldn’t get a security code to work when accessing one. I’ll do more research and figure this out. Does it upload into the SSL folder I see in the server?

Of course, glad that got it working for you. With mobile phones you’ll need to manually clear the cache in the privacy settings (different for each browser/device) but with enough time the proper version will load for everyone—regardless of whether or not they clear their cache manually.

I’d recommend taking a peek at the help documentation on Bluehost’s site here although, humorously, this page itself has SSL issues. It looks like they have a toggle for their free SSL under the security section of the control panel.

So I’ve been looking into Bluehost’s SSL and it appears to have worked differently for different URLS?

IS SECURE (with https://)

IS NOT SECURE (with out https://)

I don’t understand why this is happening? I have tried hard refreshing the page.

Https is necessary in order for the site to be secure, however most sites will automatically redirect traffic from the non-secure URL to the secure (https) URL. For example, if I try and like to my own site with a non-https URL (http://mikeyevin.com) it will redirect to the secure version automatically.

A quick search led me to this article on Bluehost’s site that says you can achieve the same functionality by editing the .htaccess file.

Most users won’t include a prefix at all, so you’ll want to make sure that redirect to the secure URL is setup to prevent users from landing on the unsecure site.

Right okay, so there is an unsecure but inaccessible (due to redirect) site for every secure website?

Thank you for the article, I will try and set up the redirect.

Does this at all have anything to do with having www. infront of a URL?

I can’t say for sure as I’m not familiar with Bluehost specifically but I’d imagine that’s different from the issue your experiencing.

From what I understand, the redirect to a non-www site URL from a www URL (or vice versa) happens separately from the https redirection.

I have it working! Took me a while to find the hidden .htaccess file. Thank you for the help, I appreciate it!

1 Like

You’re effectively throwing your money away with BlueHost. Been there done that!

Yes it doesn’t look particularly brilliant but I am working with what my client wanted as she has recently paid for a subscription. Can you suggest better services? I am quite new to web-design and it would be good to know opinions :slight_smile:

Josh,

If you are just focused on web design with your client and are using Webflow it is not absolutely necessary to have a host. The minimum requirement is just the domain name service via any provider.

If you require the host then there may be more cost effective solutions depending on if you are housing files or databases.

When a webflow site is just pointing at your DNS just Webflow manages the files and then you wouldnt have needed to deal much with SSL and Apache issues. You can also savor whatever the cost of your hosting is charging for SSL because Webflow has a LetsEncrypt implementation.

Do you mean that I do not have to have an external host if I have a hosting plan with Webflow? Webflow’s hosting is what the client wanted to avoid.

Right now I am building a portfolio and completing the work for cheap. The hosting cost of Webflow is too much for the client that I am working with.

Ideally, I will be moving towards clients who can afford to host with Webflow but I am having to export the code and host elsewhere as a work around for now

Understood,

Saving is key. Since you are exporting the Webflow files as a zip you could use Netlify free. Pro version is cheap too but probably dont even need it unless you require something in that package. If you are always deploying static content anything like Netlify will work. But you would also have to migrate the domain there if you switch.

https://www.netlify.com/pricing/

I am getting the same problem. I have designed my website by downloading free responsive bootstrap template and tried inlining the css. I don’t know what wrong inhave done. My css files are not properly working. Kindly see my website https://www.riya-kapoor.co.in/
And please let me know that what wrong I have done and how can I make it correct.