29 lines
1.5 KiB
Plaintext
29 lines
1.5 KiB
Plaintext
|
Simplified steps:
|
|||
|
|
|
|||
|
|
Step 1 - Initialize Your Project as a Hugo Module
|
|||
|
|
Open your terminal. Use the command hugo mod init github.com/your-username/repository-name, replacing “your-username” and “repository-name” with your GitHub information.
|
|||
|
|
This creates a file called go.mod in your project’s root.
|
|||
|
|
|
|||
|
|
Step 2 - Add Hugo Bootstrap Module to Your Config File
|
|||
|
|
Locate your project’s configuration file, which could be named config.toml or hugo.toml.
|
|||
|
|
Add the following code in the .toml format, or adjust if you prefer YAML or JSON:
|
|||
|
|
|
|||
|
|
[module]
|
|||
|
|
[[module.imports]]
|
|||
|
|
path = "github.com/gohugoio/hugo-mod-bootstrap-scss/v5"
|
|||
|
|
|
|||
|
|
Step 3 - Update the Added Module#
|
|||
|
|
In your terminal, run hugo mod get -u.
|
|||
|
|
This command downloads the module to your project, and you’ll find a new file called go.sum in your project’s root.
|
|||
|
|
|
|||
|
|
Step 4 - Create SCSS and JS Files in the Assets Directory#
|
|||
|
|
Inside your project, create a folder named “scss” in the assets directory.
|
|||
|
|
In the “scss” folder, create a file named “styles.scss”.
|
|||
|
|
Create another folder in the assets directory named “js”.
|
|||
|
|
In the “js” folder, create a file named “index.js”.
|
|||
|
|
You should now have these files: /assets/scss/styles.scss and /assets/js/index.js.
|
|||
|
|
|
|||
|
|
Step 5 - Add CSS and JS Links in Your Project’s Head#
|
|||
|
|
In the head section of your website, add links to the files created in step 4. This allows your pages to access the SCSS and JS files for styling and functionality.
|
|||
|
|
More code I do not yet understand just above the closing head tag (</head>)
|