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>)
|