How to replace a Hugo theme's default homepage and define a custom route? - static

I have been building a personal portfolio site and blog using the Hugo theme LoveIt. As the theme is heavily blog-centric, I want to replace the theme's homepage with my custom static HTML page and keep the theme's default homepage available at the /blog URL.
For example,
If the site's URL is example.com.
I want to have my custom.html page available at example.com and the theme's default homepage at example.com/blog.
I have searched Hugo docs and forums but didn't find any official document or best practice for changing routes or homepage. Thanks in advance.

You should be able to place your custom.html content as index.html in the layouts/ directory located off the root of your site as layouts/index.html.
This should override the theme's index.html page.

Related

URL config Wagtail-pages in own Django project

I have set up my own Django-project. I have no own app’s installed. That’s for later. What I did was copying the ‘base’ and ‘blog’ app from the bakerydemo to my own project. These run fine, I can access the blog-pages and the admin-site from wagtail.
Only problem is the root url is now a blank-page (can’t add wagtail-field or anything). My wagtail homepage is now on ip-adress/home and it should be on ip-adress. This is my url-config:
from wagtail.admin import urls as wagtailadmin_urls
from wagtail import urls as wagtail_urls
from wagtail.documents import urls as wagtaildocs_urls
urlpatterns = [
path('admin/', admin.site.urls),
path('cms/', include(wagtailadmin_urls)),
path('documents/', include(wagtaildocs_urls)),
# path('pages/', include(wagtail_urls)),
path('', include(wagtail_urls)),
# path("test404/", TemplateView.as_view(template_name="404.html")>
# path("test500/", TemplateView.as_view(template_name="500.html")>
]
How can I change this? So my first wagtail page is on root-url and not on root-url/home/
Thnx in advanced.
Edit: found this on the wagtail docs, but don’t know how to apply:
Note that there’s one small difference when not using the Wagtail project template: Wagtail creates an initial homepage of the basic type Page, which does not include any content fields beyond the title. You’ll probably want to replace this with your own HomePage class - when you do so, ensure that you set up a site record (under Settings / Sites in the Wagtail admin) to point to the new homepage.
Instead of trying to move your wagtail page to root-url, you should create (or update) the default site so its root_page should be the page currently shown at /home/

How to make a SvelteKit SPA prerender index.html

I have a SvelteKit application that I'm building with static adapter.
I'm setting a fallback in svelte.config to make it a SPA.
{
kit: {
adapter: adapter({
fallback: 'index.html'
})
}
}
In /routes I have a folder called (prerendered) that has a +layout.js file with export const prerender = true; as described in the svelte docs here.
If I put my root +page.svelte and a tree of nested article and marketing pages into that (prerendered) folder, I get prerendered html files for the articles, but not for index.html.
Is there a way to prerender index.html in a static SPA?
That is not what the fallback is for. It serves to resolve dynamic routes that have not been or cannot be pre-rendered and thus not served by a simple file server, all it does is route to a page.
If you already have a +page.svelte you want to use as the index, you should not set fallback. The page for the root route will automatically be turned into an index.html.

Nginx + React fail to load resources

Hey. I have a problem with react. I use '/' path for client (some static html content), and '/panel' for example for another server using 1 domain.
But i have errors which don't load my react page.
So on home location (http://localhost/) all good.
http://localhost/panel - only 'react app' in title.
That's because your React app tries to load the CSS and JS from the root path. Configure the homePage field in package json to be
"homePage": "/panel"

How can I remove the React App symbol and name or the "Website created using create-react-app"?

I have deployed my website with firebase hosting. Everytime I go the site, there's still the name React App on the tabs of my browser. Do I have to purchase a domain name to get rid of it?
You can change the title of the index.html page in the public directory. And for the customizing the icon, you can change the favicon also located in the public directory.
simply go to the /public folder of your react app and change the <title> React App </title> in index.html file to whatever the title of your website is.

Empty page with react router in github pages. Package.json home or .env PUBLIC_URL

The problem: When i go to any internal root, and press f5, it broke, givin 404. Like for example:
https://josuevalrob.github.io/jeval-web/sign-in. But if I go to the root it works fine: https://josuevalrob.github.io/jeval-web
I don't know how to solve this problem. There is a bunch of documentation about this, and I cant handle it.
This is the github repo: https://github.com/josuevalrob/jeval-web
This is the github Page: https://josuevalrob.github.io/jeval-web
And you can see, the package json have the home key:
"homepage": "https://josuevalrob.github.io/jeval-web",
Also the .env is currently empty, but i can add this:
PUBLIC_URL = "https://josuevalrob.github.io/jeval-web"
Nevertheless, it doesn't work.
I had added the homepage or the public_url, neither work.
Github pages doesn't really support single page applications. Single page applications require a server that serves the same page at every url and then the client renders the appropriate content based on the url. Hence the "single page". Github does not allow you to run server side code, so you can't write a server to serve your index.html at every route.
There is, however, a hack you can use to make this work. When you navigate to a route other than the root url, Github will serve a 404 page as you can see. Github allows you to customize this 404 page. So, you can make the custom 404 page your single page application and then it will be served at every route as required.
This repo explains the required steps to serve your single page as a custom 404 page on Github pages.
Basically it amounts to...
Copy this 404.html page to your repo as is
Add this redirect script to your index.html page
The only drawback is that the url is forced to redirect and quickly flashes the incorrect URL before redirecting. You can see an example of this by refreshing this page. If you want to avoid this, you need to look for hosting somewhere else that allows you to edit server side code and serve your index.html at every route
I had a similar issue with react app. I fixed it by using HashRouter instead of BrowserRouter in App component

Resources