Broken link in my reactjs hosted from netlify - html

I recently hosted in Netlify through github and my website which is rendered from reactjs. My website link is https://realhomes.netlify.com/ . So when i try to reload my website from other page except from home(index page) it shows broken link and i don't know how to fix it. Please help.

It looks like you're using react-router within your site to route between different pages. If that's the case, you'll need to tell Netlify to serve the index.html file for everything, not just the root of the site.
From this netlify blog post
If you choose to use something for routing (like React Router for example), you will need to set up a redirect and rewrite rule for the single page app.
Try adding /* /index.html 200 to a _redirects file in your publish directory or the following to your netlify.toml.
[[redirects]]
from = "/*"
to = "/index.html"
status = 200
Read the docs here

In the public folder create _redirects file and add /* /index.html 200, now your app will not crash on refresh.

If someone wants to know how the netlify.toml file looks like you can find it in my
github repository in Link Here and it works.

Related

Issue with uploading website successfully to GitHub Pages

I'm having an issue with uploading my website to GitHub pages. I am a beginner and have just made my first website that uses several html files. I have created a repository for this website. The website contains index.html, and 2 other html files. When I first open the website through GitHub Pages it appears to be fine, however if I click on a link on the website which takes me to the main page (the main page being index.html) it opens up a completely different website from my other repository. I realised this is because it uses the same url (username.github.io/index.html) as my other repository. Since both of these are the same I guess it just opens up my other website because it was created earlier.
This is my first issue. I also have another issue. My other 2 html files have a unique html file name, but when I open the link for them I get a 404 error:
"The site configured at this address does not contain the requested file."
From what I understand, a GitHub Pages URL would look like this:
username.github.io/repository name/html file name.
My website looks fine when I open it with this URL:
username.github.io/repository name
However, when I click on any link on the website the URL loses it's repository name and changes into:
username.github.io/html file name which brings up a 404 error.
I don't understand why it does that.
The URLs in your links start with /, which points at the root of the domain.
Don't do that.

Bad rendering of the local index.html from public folder using HUGO

I am creating a web using RStudio and HUGO, by means of the Blogdown package.
When serving the site locally in RStudio, it seems to be rendered properly. All the files are created within the folder /public.
However, when I open the file index.html from the /public folder, I get this appearance.
I am employing the theme Mainroad with this base URL:
baseurl = "/"
Any idea why when opening the HTML file it is not rendered properly?
Thanks to the HUGO forum, I post the answer that worked for me, just in case somebody get here.
It is pretty simple, just by adding two lines at the top of the config.toml file:
relativeURLs = true
uglyURLs = true
Open the html file in a text editor and check the exact links given for the stylesheets. More than likely, it is not resolvable by the web-browser because it starts with a / and so looks like an absolute path.
When viewed via the microserver packaged with hugo, that would be seen as relative to the server. But when view via a file url, it is seen as an absolute path.
Blogdown has released an updated version on CRAN that may address this issue. See this link for discussion: https://github.com/rstudio/blogdown/issues/372

Wordpress website redirects to "index.html" which doesn't exisit

My Wordpress website, www.the-family-historian.net, goes directly to /index.html, which doesn't exist. I have it set in the Wordpress backend so that the landing page is the posts (blog) and not a static page, but this "index.html" seems to be blocking it. Thanks for any help!
Try setting the following at the top of the .htaccess file:
DirectoryIndex index.php
This should force any request to go to index.php first and ignore index.html, not a 301 redirect though.
Using an FTP program, or possibly a web based file manager, view the files that make up your website. Find an option to view "system / hidden files" in order to view the .htaccess file. I suspect you will find a rewrite rule in it pointing to index.html Simply change that to index.php and all should be good.

My CSS doesn't render at all when I host my jekyll on gh-pages with my own domain

When I test my site on local host, the CSS and JavaScript are looking perfect. But when I push it to github repo I only see the HTML. No style. https://github.com/jaubut/website I've tried to change my URL to https://chanvrequebec.com in my config.yml. I've also try to change my href="/css/main.css" to href="css/main.css". BUT NOTHING happens at all. I don't know what to do. Please help. Thanks
your website is beautifully displayed at http://chanvrequebec.com/ - not https:// as described in your question!
If you have a SSL/TLS certificate for this domain, you'll need to change the url on _config.yml to the same protocol https://chanvrequebec.com
Things to be aware of:
1st. in you _config.yml you've set:
markdown: redcarpet
But from May 1st on, GitHub Pages will not support redcarpet anymore. So, I suggest you to change it to:
markdown: kramdown
2nd. Your website should be also completely accessible under http://jaubut.github.io/website, but it's not, due to mistaken configuration of GitHub Pages. You created a project website, so you'd need to set the baseurl to baseurl: '/website' to correct that. Or set the url to http://jaubut.github.io/website. But this not the best approach here, as all your internal links would redirect the pages to the github.io subdomain.
So, finally, to fix this properly, the best approach would be:
Create a new repository called jaubut.github.io (User website)
Transfer the content of your repo website into the master branch of the repo created on the previous step
Keep your _config.yml the way it is now
Your website will be accessible under http://jabot.github.io and also under http://chanvrequebec.com/
Delete website repository
If you have a SSL/TLS digital certificate for your domain chanvrequebec.com, don't forget to change the url on your _config.yml from url: "http://chanvrequebec.com" to url: "https://chanvrequebec.com"
Done!
I hope to have helped!
Your website is hosted in the subfolder 'website'. The correct link for the css is href="/website/css/main.css". The correct address seems to be: http://jaubut.github.io/website. If you want a custom domain, you should use a CNAME file, see: https://help.github.com/articles/setting-up-your-pages-site-repository/.

Static HTML page that links to current Wordpress blog

So, I currently have a WP blog installed. What I want to do is put a static HTML landing page at the root of the site and then a link to the blog. The HTML landing page does not look similar in theme and everything is hosted under the same domain.
How can I do this with this current structure?
I suppose I would have to somehow move the blog to /blog instead of the root?
Thanks.
Depending on what server you're running, you might not need to do anything. Certain servers, like Apache, have a DirectoryIndex which gives priority to .html files by default. So even if you had index.html and index.php in the same folder, it would load the index.html file.
You could also define the priority in an htaccess file or use the commenter above's suggestion of pasting the HTML into the index.php template and then making a "home" template and telling Wordpress to use that specific page as the homepage.
That being said, I would strongly recommend installing Wordpress in a sub-directory, such as "/blog" as you mentioned. Just as a fail-safe.