Latest commit

History

58 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

NCB Website V2.0

Hugoplate is a free starter template built with Hugo and Tailwind CSS v4.0, providing everything you need to jumpstart your Hugo project and save valuable time.

Made with ♥ by Zeon Studio

If you find this project useful, please give it a ⭐ to show your support.

licensecode sizecontributors

🎁 What's Included

We have included almost everything you need to start your Hugo project. Let's see what's included in this template:

📌 Key Features

  • 👥 Multi-Authors
  • 🎯 Similar Posts Suggestion
  • 🔍 Search Functionality
  • 🌑 Dark Mode
  • 🏷️ Tags & Categories
  • 🔗 Netlify setting pre-configured
  • 📞 Support contact form
  • 📱 Fully responsive
  • 📝 Write and update content in Markdown
  • 💬 Disqus Comment
  • 🔳 Syntax Highlighting

📄 15+ Pre-designed Pages

  • 🏠 Homepage
  • 👤 About
  • 📞 Contact
  • 👥 Authors
  • 👤 Author Single
  • 📝 Blog
  • 📝 Blog Single
  • 🚫 Custom 404
  • 💡 Elements
  • 📄 Privacy Policy
  • 🏷️ Tags
  • 🏷️ Tag Single
  • 🗂️ Categories
  • 🗂️ Category Single
  • 🔍 Search

📦 Tech Stack


🚀 Getting Started

First you need to clone or download the template repository, and then let's get started with the following process:

⚙️ Prerequisites

To start using this template, you need to have some prerequisites installed on your machine.

👉 Project Setup

We built this custom script to make your project setup easier. It will create a new Hugo theme folder and clone the Hugoplate theme into it. Then move the exampleSite folder into the root directory. So that you can start your Hugo server without going into the exampleSite folder. Use the following command to setup your project.

npm run project-setup

👉 Install Dependencies

Install all the dependencies using the following command.

npm install

👉 Development Command

Start the development server using the following command.

npm run dev

🎬 Still Confused? Watch a Quick Video

hugoplate-quick-setup.mp4

📝 Customization

This template has been designed with a lot of customization options in mind. You can customize almost anything you want, including:

👉 Site Config

You can change the site title, base URL, language, theme, plugins, and more from the hugo.toml file.

👉 Site Params

You can customize all the parameters from the config/_default/params.toml file. This includes the logo, favicon, search, SEO metadata, and more.

👉 Colors and Fonts

You can change the colors and fonts from the data/theme.json file. This includes the primary color, secondary color, font family, and font size.

👉 Social Links

You can change the social links from the data/social.json file. Add your social links here, and they will automatically be displayed on the site.


🛠 Advanced Usage

We have added some custom scripts to make your life easier. You can use these scripts to help you with your development.

👉 Update Theme

If you want to update the theme, then you can use the following command. It will update the theme to the latest version.

npm run update-theme

Note: This command will work after running the project-setup script.

👉 Update Modules

We have added a lot of modules to this template. You can update all the modules using the following command.

npm run update-modules

👉 Remove Dark Mode

If you want to remove dark mode from your project, you can use the following command to remove dark mode from your project.

npm run remove-darkmode

Note: This command will work before running the project-setup script. If you have already run the project-setup command, then you have to run npm run theme-setup first, and then you can run this command. Afterward, you can run npm run project-setup again.


🚀 Build And Deploy

After you finish your development, you can build or deploy your project almost everywhere. Let's see the process:

👉 Build Command

To build your project locally, you can use the following command.

npm run build

👉 Deploy Site

We have provided 5 different deploy platform configurations with this template, so you can deploy easily.

And if you want to host some other hosting platforms. Then you can build your project, and you will get a public folder. that you can copy and paste on your hosting platform.

Note: You must change the baseURL in the hugo.toml file. Otherwise, your site will not work properly.


🔒 Guide to Staying Compliant

🐞 Reporting Issues

We use GitHub Issues as the official bug tracker for this Template. Please search existing issues. Someone may have already reported the same problem. If your problem or idea has not been addressed yet, feel free to open a new issue.

📝 License

Copyright (c) 2023 - Present, Designed & Developed by Zeon Studio

Code License: Released under the MIT license.

Image license: The images are only for demonstration purposes. They have their license, we don't have permission to share those images.


🖼️ Showcase

List of some projects people are building with Hugoplate! Don't forget to add yours.


💻 Need Customization?

If you need a custom theme, theme customization, or complete website development services from scratch, you can Hire Us.

About

Nordic CompBio - Website Dev

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Add copy buttons to all
 blocks
(function() {
function addCopyButtons() {
document.querySelectorAll('pre code').forEach(function(codeBlock) {
if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;
codeBlock.parentElement.setAttribute('data-copy-added', 'true');
var btn = document.createElement('button');
btn.textContent = 'Copy';
btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';
btn.onmouseover = function() { this.style.opacity = '1'; };
btn.onmouseout = function() { this.style.opacity = '0.7'; };
btn.onclick = function() {
navigator.clipboard.writeText(codeBlock.textContent).then(function() {
btn.textContent = 'Copied!';
setTimeout(function() { btn.textContent = 'Copy'; }, 1500);
});
};
codeBlock.parentElement.style.position = 'relative';
codeBlock.parentElement.appendChild(btn);
});
}
addCopyButtons();
// Re-run on dynamic content
var observer = new MutationObserver(addCopyButtons);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content

Latest commit

History

58 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

NCB Website V2.0

Hugoplate is a free starter template built with Hugo and Tailwind CSS v4.0, providing everything you need to jumpstart your Hugo project and save valuable time.

Made with ♥ by Zeon Studio

If you find this project useful, please give it a ⭐ to show your support.

licensecode sizecontributors

🎁 What's Included

We have included almost everything you need to start your Hugo project. Let's see what's included in this template:

📌 Key Features

  • 👥 Multi-Authors
  • 🎯 Similar Posts Suggestion
  • 🔍 Search Functionality
  • 🌑 Dark Mode
  • 🏷️ Tags & Categories
  • 🔗 Netlify setting pre-configured
  • 📞 Support contact form
  • 📱 Fully responsive
  • 📝 Write and update content in Markdown
  • 💬 Disqus Comment
  • 🔳 Syntax Highlighting

📄 15+ Pre-designed Pages

  • 🏠 Homepage
  • 👤 About
  • 📞 Contact
  • 👥 Authors
  • 👤 Author Single
  • 📝 Blog
  • 📝 Blog Single
  • 🚫 Custom 404
  • 💡 Elements
  • 📄 Privacy Policy
  • 🏷️ Tags
  • 🏷️ Tag Single
  • 🗂️ Categories
  • 🗂️ Category Single
  • 🔍 Search

📦 Tech Stack


🚀 Getting Started

First you need to clone or download the template repository, and then let's get started with the following process:

⚙️ Prerequisites

To start using this template, you need to have some prerequisites installed on your machine.

👉 Project Setup

We built this custom script to make your project setup easier. It will create a new Hugo theme folder and clone the Hugoplate theme into it. Then move the exampleSite folder into the root directory. So that you can start your Hugo server without going into the exampleSite folder. Use the following command to setup your project.

npm run project-setup

👉 Install Dependencies

Install all the dependencies using the following command.

npm install

👉 Development Command

Start the development server using the following command.

npm run dev

🎬 Still Confused? Watch a Quick Video

hugoplate-quick-setup.mp4

📝 Customization

This template has been designed with a lot of customization options in mind. You can customize almost anything you want, including:

👉 Site Config

You can change the site title, base URL, language, theme, plugins, and more from the hugo.toml file.

👉 Site Params

You can customize all the parameters from the config/_default/params.toml file. This includes the logo, favicon, search, SEO metadata, and more.

👉 Colors and Fonts

You can change the colors and fonts from the data/theme.json file. This includes the primary color, secondary color, font family, and font size.

👉 Social Links

You can change the social links from the data/social.json file. Add your social links here, and they will automatically be displayed on the site.


🛠 Advanced Usage

We have added some custom scripts to make your life easier. You can use these scripts to help you with your development.

👉 Update Theme

If you want to update the theme, then you can use the following command. It will update the theme to the latest version.

npm run update-theme

Note: This command will work after running the project-setup script.

👉 Update Modules

We have added a lot of modules to this template. You can update all the modules using the following command.

npm run update-modules

👉 Remove Dark Mode

If you want to remove dark mode from your project, you can use the following command to remove dark mode from your project.

npm run remove-darkmode

Note: This command will work before running the project-setup script. If you have already run the project-setup command, then you have to run npm run theme-setup first, and then you can run this command. Afterward, you can run npm run project-setup again.


🚀 Build And Deploy

After you finish your development, you can build or deploy your project almost everywhere. Let's see the process:

👉 Build Command

To build your project locally, you can use the following command.

npm run build

👉 Deploy Site

We have provided 5 different deploy platform configurations with this template, so you can deploy easily.

And if you want to host some other hosting platforms. Then you can build your project, and you will get a public folder. that you can copy and paste on your hosting platform.

Note: You must change the baseURL in the hugo.toml file. Otherwise, your site will not work properly.


🔒 Guide to Staying Compliant

🐞 Reporting Issues

We use GitHub Issues as the official bug tracker for this Template. Please search existing issues. Someone may have already reported the same problem. If your problem or idea has not been addressed yet, feel free to open a new issue.

📝 License

Copyright (c) 2023 - Present, Designed & Developed by Zeon Studio

Code License: Released under the MIT license.

Image license: The images are only for demonstration purposes. They have their license, we don't have permission to share those images.


🖼️ Showcase

List of some projects people are building with Hugoplate! Don't forget to add yours.


💻 Need Customization?

If you need a custom theme, theme customization, or complete website development services from scratch, you can Hire Us.

About

Nordic CompBio - Website Dev

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Force GitHub README to respect dark mode (function() { var style = document.createElement('style'); style.textContent = ' .markdown-body { color-scheme: dark light; } .markdown-body pre { background: #161b22 !important; } .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; } .markdown-body table th, .markdown-body table td { border-color: #30363d !important; } .markdown-body img { background: #0d1117; } .markdown-body blockquote { border-left-color: #8b949e; } .markdown-body hr { border-color: #30363d; } '; document.head.appendChild(style); })(); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Latest commit

History

58 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

NCB Website V2.0

Hugoplate is a free starter template built with Hugo and Tailwind CSS v4.0, providing everything you need to jumpstart your Hugo project and save valuable time.

Made with ♥ by Zeon Studio

If you find this project useful, please give it a ⭐ to show your support.

licensecode sizecontributors

🎁 What's Included

We have included almost everything you need to start your Hugo project. Let's see what's included in this template:

📌 Key Features

  • 👥 Multi-Authors
  • 🎯 Similar Posts Suggestion
  • 🔍 Search Functionality
  • 🌑 Dark Mode
  • 🏷️ Tags & Categories
  • 🔗 Netlify setting pre-configured
  • 📞 Support contact form
  • 📱 Fully responsive
  • 📝 Write and update content in Markdown
  • 💬 Disqus Comment
  • 🔳 Syntax Highlighting

📄 15+ Pre-designed Pages

  • 🏠 Homepage
  • 👤 About
  • 📞 Contact
  • 👥 Authors
  • 👤 Author Single
  • 📝 Blog
  • 📝 Blog Single
  • 🚫 Custom 404
  • 💡 Elements
  • 📄 Privacy Policy
  • 🏷️ Tags
  • 🏷️ Tag Single
  • 🗂️ Categories
  • 🗂️ Category Single
  • 🔍 Search

📦 Tech Stack


🚀 Getting Started

First you need to clone or download the template repository, and then let's get started with the following process:

⚙️ Prerequisites

To start using this template, you need to have some prerequisites installed on your machine.

👉 Project Setup

We built this custom script to make your project setup easier. It will create a new Hugo theme folder and clone the Hugoplate theme into it. Then move the exampleSite folder into the root directory. So that you can start your Hugo server without going into the exampleSite folder. Use the following command to setup your project.

npm run project-setup

👉 Install Dependencies

Install all the dependencies using the following command.

npm install

👉 Development Command

Start the development server using the following command.

npm run dev

🎬 Still Confused? Watch a Quick Video

hugoplate-quick-setup.mp4

📝 Customization

This template has been designed with a lot of customization options in mind. You can customize almost anything you want, including:

👉 Site Config

You can change the site title, base URL, language, theme, plugins, and more from the hugo.toml file.

👉 Site Params

You can customize all the parameters from the config/_default/params.toml file. This includes the logo, favicon, search, SEO metadata, and more.

👉 Colors and Fonts

You can change the colors and fonts from the data/theme.json file. This includes the primary color, secondary color, font family, and font size.

👉 Social Links

You can change the social links from the data/social.json file. Add your social links here, and they will automatically be displayed on the site.


🛠 Advanced Usage

We have added some custom scripts to make your life easier. You can use these scripts to help you with your development.

👉 Update Theme

If you want to update the theme, then you can use the following command. It will update the theme to the latest version.

npm run update-theme

Note: This command will work after running the project-setup script.

👉 Update Modules

We have added a lot of modules to this template. You can update all the modules using the following command.

npm run update-modules

👉 Remove Dark Mode

If you want to remove dark mode from your project, you can use the following command to remove dark mode from your project.

npm run remove-darkmode

Note: This command will work before running the project-setup script. If you have already run the project-setup command, then you have to run npm run theme-setup first, and then you can run this command. Afterward, you can run npm run project-setup again.


🚀 Build And Deploy

After you finish your development, you can build or deploy your project almost everywhere. Let's see the process:

👉 Build Command

To build your project locally, you can use the following command.

npm run build

👉 Deploy Site

We have provided 5 different deploy platform configurations with this template, so you can deploy easily.

And if you want to host some other hosting platforms. Then you can build your project, and you will get a public folder. that you can copy and paste on your hosting platform.

Note: You must change the baseURL in the hugo.toml file. Otherwise, your site will not work properly.


🔒 Guide to Staying Compliant

🐞 Reporting Issues

We use GitHub Issues as the official bug tracker for this Template. Please search existing issues. Someone may have already reported the same problem. If your problem or idea has not been addressed yet, feel free to open a new issue.

📝 License

Copyright (c) 2023 - Present, Designed & Developed by Zeon Studio

Code License: Released under the MIT license.

Image license: The images are only for demonstration purposes. They have their license, we don't have permission to share those images.


🖼️ Showcase

List of some projects people are building with Hugoplate! Don't forget to add yours.


💻 Need Customization?

If you need a custom theme, theme customization, or complete website development services from scratch, you can Hire Us.

About

Nordic CompBio - Website Dev

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Highlight search terms from Google/DuckDuckGo/Bing referrer (function() { var ref = document.referrer; var terms = []; if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) { var url = new URL(ref); var q = url.searchParams.get('q') || url.searchParams.get('p'); if (q) { terms = q.split(/\s+/).filter(function(t) { return t.length > 2; }); } } if (terms.length === 0) return; var style = document.createElement('style'); style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }'; document.head.appendChild(style); function highlight(node) { if (node.nodeType === 3) { // text node var text = node.textContent; var found = false; terms.forEach(function(term) { var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\]\\]/g, '\\') + ')', 'gi'); if (regex.test(text)) { found = true; var frag = document.createDocumentFragment(); var parts = text.split(regex); parts.forEach(function(part, i) { if (i % 2 === 0) { frag.appendChild(document.createTextNode(part)); } else { var span = document.createElement('span'); span.className = 'userscript-highlight'; span.textContent = part; frag.appendChild(span); } }); node.parentNode.replaceChild(frag, node); } }); } else if (node.nodeType === 1 && node.childNodes) { // element var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT']; if (!skipTags.includes(node.tagName)) { Array.from(node.childNodes).forEach(highlight); } } } highlight(document.body); // Re-highlight on dynamic content var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1 || node.nodeType === 3) highlight(node); }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Latest commit

History

58 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

NCB Website V2.0

Hugoplate is a free starter template built with Hugo and Tailwind CSS v4.0, providing everything you need to jumpstart your Hugo project and save valuable time.

Made with ♥ by Zeon Studio

If you find this project useful, please give it a ⭐ to show your support.

licensecode sizecontributors

🎁 What's Included

We have included almost everything you need to start your Hugo project. Let's see what's included in this template:

📌 Key Features

  • 👥 Multi-Authors
  • 🎯 Similar Posts Suggestion
  • 🔍 Search Functionality
  • 🌑 Dark Mode
  • 🏷️ Tags & Categories
  • 🔗 Netlify setting pre-configured
  • 📞 Support contact form
  • 📱 Fully responsive
  • 📝 Write and update content in Markdown
  • 💬 Disqus Comment
  • 🔳 Syntax Highlighting

📄 15+ Pre-designed Pages

  • 🏠 Homepage
  • 👤 About
  • 📞 Contact
  • 👥 Authors
  • 👤 Author Single
  • 📝 Blog
  • 📝 Blog Single
  • 🚫 Custom 404
  • 💡 Elements
  • 📄 Privacy Policy
  • 🏷️ Tags
  • 🏷️ Tag Single
  • 🗂️ Categories
  • 🗂️ Category Single
  • 🔍 Search

📦 Tech Stack


🚀 Getting Started

First you need to clone or download the template repository, and then let's get started with the following process:

⚙️ Prerequisites

To start using this template, you need to have some prerequisites installed on your machine.

👉 Project Setup

We built this custom script to make your project setup easier. It will create a new Hugo theme folder and clone the Hugoplate theme into it. Then move the exampleSite folder into the root directory. So that you can start your Hugo server without going into the exampleSite folder. Use the following command to setup your project.

npm run project-setup

👉 Install Dependencies

Install all the dependencies using the following command.

npm install

👉 Development Command

Start the development server using the following command.

npm run dev

🎬 Still Confused? Watch a Quick Video

hugoplate-quick-setup.mp4

📝 Customization

This template has been designed with a lot of customization options in mind. You can customize almost anything you want, including:

👉 Site Config

You can change the site title, base URL, language, theme, plugins, and more from the hugo.toml file.

👉 Site Params

You can customize all the parameters from the config/_default/params.toml file. This includes the logo, favicon, search, SEO metadata, and more.

👉 Colors and Fonts

You can change the colors and fonts from the data/theme.json file. This includes the primary color, secondary color, font family, and font size.

👉 Social Links

You can change the social links from the data/social.json file. Add your social links here, and they will automatically be displayed on the site.


🛠 Advanced Usage

We have added some custom scripts to make your life easier. You can use these scripts to help you with your development.

👉 Update Theme

If you want to update the theme, then you can use the following command. It will update the theme to the latest version.

npm run update-theme

Note: This command will work after running the project-setup script.

👉 Update Modules

We have added a lot of modules to this template. You can update all the modules using the following command.

npm run update-modules

👉 Remove Dark Mode

If you want to remove dark mode from your project, you can use the following command to remove dark mode from your project.

npm run remove-darkmode

Note: This command will work before running the project-setup script. If you have already run the project-setup command, then you have to run npm run theme-setup first, and then you can run this command. Afterward, you can run npm run project-setup again.


🚀 Build And Deploy

After you finish your development, you can build or deploy your project almost everywhere. Let's see the process:

👉 Build Command

To build your project locally, you can use the following command.

npm run build

👉 Deploy Site

We have provided 5 different deploy platform configurations with this template, so you can deploy easily.

And if you want to host some other hosting platforms. Then you can build your project, and you will get a public folder. that you can copy and paste on your hosting platform.

Note: You must change the baseURL in the hugo.toml file. Otherwise, your site will not work properly.


🔒 Guide to Staying Compliant

🐞 Reporting Issues

We use GitHub Issues as the official bug tracker for this Template. Please search existing issues. Someone may have already reported the same problem. If your problem or idea has not been addressed yet, feel free to open a new issue.

📝 License

Copyright (c) 2023 - Present, Designed & Developed by Zeon Studio

Code License: Released under the MIT license.

Image license: The images are only for demonstration purposes. They have their license, we don't have permission to share those images.


🖼️ Showcase

List of some projects people are building with Hugoplate! Don't forget to add yours.


💻 Need Customization?

If you need a custom theme, theme customization, or complete website development services from scratch, you can Hire Us.

About

Nordic CompBio - Website Dev

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Strip utm_, fbclid, gclid, etc. from all links on page (function() { var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content', 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid', 'ref', 'ref_src', 'source', 'medium', 'campaign']; function cleanUrl(url) { try { var u = new URL(url, window.location.origin); var changed = false; trackingParams.forEach(function(p) { if (u.searchParams.has(p)) { u.searchParams.delete(p); changed = true; } }); return changed ? u.toString() : url; } catch (e) { return url; } } function cleanLinks() { document.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } cleanLinks(); var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1) { if (node.tagName === 'A') cleanLinks(); node.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content

Latest commit

History

58 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

NCB Website V2.0

Hugoplate is a free starter template built with Hugo and Tailwind CSS v4.0, providing everything you need to jumpstart your Hugo project and save valuable time.

Made with ♥ by Zeon Studio

If you find this project useful, please give it a ⭐ to show your support.

licensecode sizecontributors

🎁 What's Included

We have included almost everything you need to start your Hugo project. Let's see what's included in this template:

📌 Key Features

  • 👥 Multi-Authors
  • 🎯 Similar Posts Suggestion
  • 🔍 Search Functionality
  • 🌑 Dark Mode
  • 🏷️ Tags & Categories
  • 🔗 Netlify setting pre-configured
  • 📞 Support contact form
  • 📱 Fully responsive
  • 📝 Write and update content in Markdown
  • 💬 Disqus Comment
  • 🔳 Syntax Highlighting

📄 15+ Pre-designed Pages

  • 🏠 Homepage
  • 👤 About
  • 📞 Contact
  • 👥 Authors
  • 👤 Author Single
  • 📝 Blog
  • 📝 Blog Single
  • 🚫 Custom 404
  • 💡 Elements
  • 📄 Privacy Policy
  • 🏷️ Tags
  • 🏷️ Tag Single
  • 🗂️ Categories
  • 🗂️ Category Single
  • 🔍 Search

📦 Tech Stack


🚀 Getting Started

First you need to clone or download the template repository, and then let's get started with the following process:

⚙️ Prerequisites

To start using this template, you need to have some prerequisites installed on your machine.

👉 Project Setup

We built this custom script to make your project setup easier. It will create a new Hugo theme folder and clone the Hugoplate theme into it. Then move the exampleSite folder into the root directory. So that you can start your Hugo server without going into the exampleSite folder. Use the following command to setup your project.

npm run project-setup

👉 Install Dependencies

Install all the dependencies using the following command.

npm install

👉 Development Command

Start the development server using the following command.

npm run dev

🎬 Still Confused? Watch a Quick Video

hugoplate-quick-setup.mp4

📝 Customization

This template has been designed with a lot of customization options in mind. You can customize almost anything you want, including:

👉 Site Config

You can change the site title, base URL, language, theme, plugins, and more from the hugo.toml file.

👉 Site Params

You can customize all the parameters from the config/_default/params.toml file. This includes the logo, favicon, search, SEO metadata, and more.

👉 Colors and Fonts

You can change the colors and fonts from the data/theme.json file. This includes the primary color, secondary color, font family, and font size.

👉 Social Links

You can change the social links from the data/social.json file. Add your social links here, and they will automatically be displayed on the site.


🛠 Advanced Usage

We have added some custom scripts to make your life easier. You can use these scripts to help you with your development.

👉 Update Theme

If you want to update the theme, then you can use the following command. It will update the theme to the latest version.

npm run update-theme

Note: This command will work after running the project-setup script.

👉 Update Modules

We have added a lot of modules to this template. You can update all the modules using the following command.

npm run update-modules

👉 Remove Dark Mode

If you want to remove dark mode from your project, you can use the following command to remove dark mode from your project.

npm run remove-darkmode

Note: This command will work before running the project-setup script. If you have already run the project-setup command, then you have to run npm run theme-setup first, and then you can run this command. Afterward, you can run npm run project-setup again.


🚀 Build And Deploy

After you finish your development, you can build or deploy your project almost everywhere. Let's see the process:

👉 Build Command

To build your project locally, you can use the following command.

npm run build

👉 Deploy Site

We have provided 5 different deploy platform configurations with this template, so you can deploy easily.

And if you want to host some other hosting platforms. Then you can build your project, and you will get a public folder. that you can copy and paste on your hosting platform.

Note: You must change the baseURL in the hugo.toml file. Otherwise, your site will not work properly.


🔒 Guide to Staying Compliant

🐞 Reporting Issues

We use GitHub Issues as the official bug tracker for this Template. Please search existing issues. Someone may have already reported the same problem. If your problem or idea has not been addressed yet, feel free to open a new issue.

📝 License

Copyright (c) 2023 - Present, Designed & Developed by Zeon Studio

Code License: Released under the MIT license.

Image license: The images are only for demonstration purposes. They have their license, we don't have permission to share those images.


🖼️ Showcase

List of some projects people are building with Hugoplate! Don't forget to add yours.


💻 Need Customization?

If you need a custom theme, theme customization, or complete website development services from scratch, you can Hire Us.

About

Nordic CompBio - Website Dev

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Auto-enable theater mode on YouTube (function() { function tryTheater() { var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]'); if (btn && !btn.classList.contains('activated')) { btn.click(); } } // Try immediately tryTheater(); // Try after navigation (SPA) var lastUrl = location.href; setInterval(function() { if (location.href !== lastUrl) { lastUrl = location.href; setTimeout(tryTheater, 500); } }, 1000); // Also try on player load var observer = new MutationObserver(tryTheater); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Latest commit

History

58 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

NCB Website V2.0

Hugoplate is a free starter template built with Hugo and Tailwind CSS v4.0, providing everything you need to jumpstart your Hugo project and save valuable time.

Made with ♥ by Zeon Studio

If you find this project useful, please give it a ⭐ to show your support.

licensecode sizecontributors

🎁 What's Included

We have included almost everything you need to start your Hugo project. Let's see what's included in this template:

📌 Key Features

  • 👥 Multi-Authors
  • 🎯 Similar Posts Suggestion
  • 🔍 Search Functionality
  • 🌑 Dark Mode
  • 🏷️ Tags & Categories
  • 🔗 Netlify setting pre-configured
  • 📞 Support contact form
  • 📱 Fully responsive
  • 📝 Write and update content in Markdown
  • 💬 Disqus Comment
  • 🔳 Syntax Highlighting

📄 15+ Pre-designed Pages

  • 🏠 Homepage
  • 👤 About
  • 📞 Contact
  • 👥 Authors
  • 👤 Author Single
  • 📝 Blog
  • 📝 Blog Single
  • 🚫 Custom 404
  • 💡 Elements
  • 📄 Privacy Policy
  • 🏷️ Tags
  • 🏷️ Tag Single
  • 🗂️ Categories
  • 🗂️ Category Single
  • 🔍 Search

📦 Tech Stack


🚀 Getting Started

First you need to clone or download the template repository, and then let's get started with the following process:

⚙️ Prerequisites

To start using this template, you need to have some prerequisites installed on your machine.

👉 Project Setup

We built this custom script to make your project setup easier. It will create a new Hugo theme folder and clone the Hugoplate theme into it. Then move the exampleSite folder into the root directory. So that you can start your Hugo server without going into the exampleSite folder. Use the following command to setup your project.

npm run project-setup

👉 Install Dependencies

Install all the dependencies using the following command.

npm install

👉 Development Command

Start the development server using the following command.

npm run dev

🎬 Still Confused? Watch a Quick Video

hugoplate-quick-setup.mp4

📝 Customization

This template has been designed with a lot of customization options in mind. You can customize almost anything you want, including:

👉 Site Config

You can change the site title, base URL, language, theme, plugins, and more from the hugo.toml file.

👉 Site Params

You can customize all the parameters from the config/_default/params.toml file. This includes the logo, favicon, search, SEO metadata, and more.

👉 Colors and Fonts

You can change the colors and fonts from the data/theme.json file. This includes the primary color, secondary color, font family, and font size.

👉 Social Links

You can change the social links from the data/social.json file. Add your social links here, and they will automatically be displayed on the site.


🛠 Advanced Usage

We have added some custom scripts to make your life easier. You can use these scripts to help you with your development.

👉 Update Theme

If you want to update the theme, then you can use the following command. It will update the theme to the latest version.

npm run update-theme

Note: This command will work after running the project-setup script.

👉 Update Modules

We have added a lot of modules to this template. You can update all the modules using the following command.

npm run update-modules

👉 Remove Dark Mode

If you want to remove dark mode from your project, you can use the following command to remove dark mode from your project.

npm run remove-darkmode

Note: This command will work before running the project-setup script. If you have already run the project-setup command, then you have to run npm run theme-setup first, and then you can run this command. Afterward, you can run npm run project-setup again.


🚀 Build And Deploy

After you finish your development, you can build or deploy your project almost everywhere. Let's see the process:

👉 Build Command

To build your project locally, you can use the following command.

npm run build

👉 Deploy Site

We have provided 5 different deploy platform configurations with this template, so you can deploy easily.

And if you want to host some other hosting platforms. Then you can build your project, and you will get a public folder. that you can copy and paste on your hosting platform.

Note: You must change the baseURL in the hugo.toml file. Otherwise, your site will not work properly.


🔒 Guide to Staying Compliant

🐞 Reporting Issues

We use GitHub Issues as the official bug tracker for this Template. Please search existing issues. Someone may have already reported the same problem. If your problem or idea has not been addressed yet, feel free to open a new issue.

📝 License

Copyright (c) 2023 - Present, Designed & Developed by Zeon Studio

Code License: Released under the MIT license.

Image license: The images are only for demonstration purposes. They have their license, we don't have permission to share those images.


🖼️ Showcase

List of some projects people are building with Hugoplate! Don't forget to add yours.


💻 Need Customization?

If you need a custom theme, theme customization, or complete website development services from scratch, you can Hire Us.

About

Nordic CompBio - Website Dev

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Remove or un-stick sticky/fixed headers that block content (function() { function unstick() { document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) { if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') { el.style.position = 'static'; el.style.top = 'auto'; el.style.zIndex = 'auto'; } }); } unstick(); var observer = new MutationObserver(unstick); observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] }); })(); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Latest commit

History

58 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

NCB Website V2.0

Hugoplate is a free starter template built with Hugo and Tailwind CSS v4.0, providing everything you need to jumpstart your Hugo project and save valuable time.

Made with ♥ by Zeon Studio

If you find this project useful, please give it a ⭐ to show your support.

licensecode sizecontributors

🎁 What's Included

We have included almost everything you need to start your Hugo project. Let's see what's included in this template:

📌 Key Features

  • 👥 Multi-Authors
  • 🎯 Similar Posts Suggestion
  • 🔍 Search Functionality
  • 🌑 Dark Mode
  • 🏷️ Tags & Categories
  • 🔗 Netlify setting pre-configured
  • 📞 Support contact form
  • 📱 Fully responsive
  • 📝 Write and update content in Markdown
  • 💬 Disqus Comment
  • 🔳 Syntax Highlighting

📄 15+ Pre-designed Pages

  • 🏠 Homepage
  • 👤 About
  • 📞 Contact
  • 👥 Authors
  • 👤 Author Single
  • 📝 Blog
  • 📝 Blog Single
  • 🚫 Custom 404
  • 💡 Elements
  • 📄 Privacy Policy
  • 🏷️ Tags
  • 🏷️ Tag Single
  • 🗂️ Categories
  • 🗂️ Category Single
  • 🔍 Search

📦 Tech Stack


🚀 Getting Started

First you need to clone or download the template repository, and then let's get started with the following process:

⚙️ Prerequisites

To start using this template, you need to have some prerequisites installed on your machine.

👉 Project Setup

We built this custom script to make your project setup easier. It will create a new Hugo theme folder and clone the Hugoplate theme into it. Then move the exampleSite folder into the root directory. So that you can start your Hugo server without going into the exampleSite folder. Use the following command to setup your project.

npm run project-setup

👉 Install Dependencies

Install all the dependencies using the following command.

npm install

👉 Development Command

Start the development server using the following command.

npm run dev

🎬 Still Confused? Watch a Quick Video

hugoplate-quick-setup.mp4

📝 Customization

This template has been designed with a lot of customization options in mind. You can customize almost anything you want, including:

👉 Site Config

You can change the site title, base URL, language, theme, plugins, and more from the hugo.toml file.

👉 Site Params

You can customize all the parameters from the config/_default/params.toml file. This includes the logo, favicon, search, SEO metadata, and more.

👉 Colors and Fonts

You can change the colors and fonts from the data/theme.json file. This includes the primary color, secondary color, font family, and font size.

👉 Social Links

You can change the social links from the data/social.json file. Add your social links here, and they will automatically be displayed on the site.


🛠 Advanced Usage

We have added some custom scripts to make your life easier. You can use these scripts to help you with your development.

👉 Update Theme

If you want to update the theme, then you can use the following command. It will update the theme to the latest version.

npm run update-theme

Note: This command will work after running the project-setup script.

👉 Update Modules

We have added a lot of modules to this template. You can update all the modules using the following command.

npm run update-modules

👉 Remove Dark Mode

If you want to remove dark mode from your project, you can use the following command to remove dark mode from your project.

npm run remove-darkmode

Note: This command will work before running the project-setup script. If you have already run the project-setup command, then you have to run npm run theme-setup first, and then you can run this command. Afterward, you can run npm run project-setup again.


🚀 Build And Deploy

After you finish your development, you can build or deploy your project almost everywhere. Let's see the process:

👉 Build Command

To build your project locally, you can use the following command.

npm run build

👉 Deploy Site

We have provided 5 different deploy platform configurations with this template, so you can deploy easily.

And if you want to host some other hosting platforms. Then you can build your project, and you will get a public folder. that you can copy and paste on your hosting platform.

Note: You must change the baseURL in the hugo.toml file. Otherwise, your site will not work properly.


🔒 Guide to Staying Compliant

🐞 Reporting Issues

We use GitHub Issues as the official bug tracker for this Template. Please search existing issues. Someone may have already reported the same problem. If your problem or idea has not been addressed yet, feel free to open a new issue.

📝 License

Copyright (c) 2023 - Present, Designed & Developed by Zeon Studio

Code License: Released under the MIT license.

Image license: The images are only for demonstration purposes. They have their license, we don't have permission to share those images.


🖼️ Showcase

List of some projects people are building with Hugoplate! Don't forget to add yours.


💻 Need Customization?

If you need a custom theme, theme customization, or complete website development services from scratch, you can Hire Us.

About

Nordic CompBio - Website Dev

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Universal Dark Mode - works on any site (function() { var enabled = true; function applyDarkMode() { if (!enabled) return; // Create style element if it doesn't exist var style = document.getElementById('universal-dark-mode-style'); if (!style) { style = document.createElement('style'); style.id = 'universal-dark-mode-style'; document.head.appendChild(style); } // Dark mode CSS - inverts colors but preserves images/video style.textContent = ' /* Invert everything except media */ html { filter: invert(1) hue-rotate(180deg) !important; background: #1a1a2e !important; } /* Restore images, videos, iframes, canvas */ img, video, iframe, canvas, svg, picture, [style*="background-image"] { filter: invert(1) hue-rotate(180deg) !important; } /* Preserve specific elements that should not be inverted */ .no-dark-mode, .no-dark-mode *, [data-theme="light"], [data-theme="light"], .ace_editor, .ace_editor *, .CodeMirror, .CodeMirror *, .monaco-editor, .monaco-editor *, .markdown-body pre, .markdown-body pre *, .highlight, .highlight *, pre code, pre code * { filter: none !important; } /* Fix common UI elements */ .modal, .popup, .dropdown-menu, .tooltip, .popover { filter: invert(1) hue-rotate(180deg) !important; background: #2d2d44 !important; border-color: #444 !important; } /* Scrollbars */ ::-webkit-scrollbar { background: #1a1a2e !important; } ::-webkit-scrollbar-thumb { background: #444 !important; } ::-webkit-scrollbar-thumb:hover { background: #555 !important; } /* Selection */ ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; } ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; } '; } function removeDarkMode() { var style = document.getElementById('universal-dark-mode-style'); if (style) style.remove(); } // Toggle with Alt+Shift+D document.addEventListener('keydown', function(e) { if (e.altKey && e.shiftKey && e.key === 'D') { e.preventDefault(); enabled = !enabled; if (enabled) { applyDarkMode(); console.log('[Universal Dark Mode] Enabled'); } else { removeDarkMode(); console.log('[Universal Dark Mode] Disabled'); } } }); // Apply on load applyDarkMode(); // Re-apply on dynamic content var observer = new MutationObserver(function(mutations) { if (enabled && !document.getElementById('universal-dark-mode-style')) { applyDarkMode(); } }); observer.observe(document.head, { childList: true }); console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle'); })(); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content

Latest commit

History

58 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

NCB Website V2.0

Hugoplate is a free starter template built with Hugo and Tailwind CSS v4.0, providing everything you need to jumpstart your Hugo project and save valuable time.

Made with ♥ by Zeon Studio

If you find this project useful, please give it a ⭐ to show your support.

licensecode sizecontributors

🎁 What's Included

We have included almost everything you need to start your Hugo project. Let's see what's included in this template:

📌 Key Features

  • 👥 Multi-Authors
  • 🎯 Similar Posts Suggestion
  • 🔍 Search Functionality
  • 🌑 Dark Mode
  • 🏷️ Tags & Categories
  • 🔗 Netlify setting pre-configured
  • 📞 Support contact form
  • 📱 Fully responsive
  • 📝 Write and update content in Markdown
  • 💬 Disqus Comment
  • 🔳 Syntax Highlighting

📄 15+ Pre-designed Pages

  • 🏠 Homepage
  • 👤 About
  • 📞 Contact
  • 👥 Authors
  • 👤 Author Single
  • 📝 Blog
  • 📝 Blog Single
  • 🚫 Custom 404
  • 💡 Elements
  • 📄 Privacy Policy
  • 🏷️ Tags
  • 🏷️ Tag Single
  • 🗂️ Categories
  • 🗂️ Category Single
  • 🔍 Search

📦 Tech Stack


🚀 Getting Started

First you need to clone or download the template repository, and then let's get started with the following process:

⚙️ Prerequisites

To start using this template, you need to have some prerequisites installed on your machine.

👉 Project Setup

We built this custom script to make your project setup easier. It will create a new Hugo theme folder and clone the Hugoplate theme into it. Then move the exampleSite folder into the root directory. So that you can start your Hugo server without going into the exampleSite folder. Use the following command to setup your project.

npm run project-setup

👉 Install Dependencies

Install all the dependencies using the following command.

npm install

👉 Development Command

Start the development server using the following command.

npm run dev

🎬 Still Confused? Watch a Quick Video

hugoplate-quick-setup.mp4

📝 Customization

This template has been designed with a lot of customization options in mind. You can customize almost anything you want, including:

👉 Site Config

You can change the site title, base URL, language, theme, plugins, and more from the hugo.toml file.

👉 Site Params

You can customize all the parameters from the config/_default/params.toml file. This includes the logo, favicon, search, SEO metadata, and more.

👉 Colors and Fonts

You can change the colors and fonts from the data/theme.json file. This includes the primary color, secondary color, font family, and font size.

👉 Social Links

You can change the social links from the data/social.json file. Add your social links here, and they will automatically be displayed on the site.


🛠 Advanced Usage

We have added some custom scripts to make your life easier. You can use these scripts to help you with your development.

👉 Update Theme

If you want to update the theme, then you can use the following command. It will update the theme to the latest version.

npm run update-theme

Note: This command will work after running the project-setup script.

👉 Update Modules

We have added a lot of modules to this template. You can update all the modules using the following command.

npm run update-modules

👉 Remove Dark Mode

If you want to remove dark mode from your project, you can use the following command to remove dark mode from your project.

npm run remove-darkmode

Note: This command will work before running the project-setup script. If you have already run the project-setup command, then you have to run npm run theme-setup first, and then you can run this command. Afterward, you can run npm run project-setup again.


🚀 Build And Deploy

After you finish your development, you can build or deploy your project almost everywhere. Let's see the process:

👉 Build Command

To build your project locally, you can use the following command.

npm run build

👉 Deploy Site

We have provided 5 different deploy platform configurations with this template, so you can deploy easily.

And if you want to host some other hosting platforms. Then you can build your project, and you will get a public folder. that you can copy and paste on your hosting platform.

Note: You must change the baseURL in the hugo.toml file. Otherwise, your site will not work properly.


🔒 Guide to Staying Compliant

🐞 Reporting Issues

We use GitHub Issues as the official bug tracker for this Template. Please search existing issues. Someone may have already reported the same problem. If your problem or idea has not been addressed yet, feel free to open a new issue.

📝 License

Copyright (c) 2023 - Present, Designed & Developed by Zeon Studio

Code License: Released under the MIT license.

Image license: The images are only for demonstration purposes. They have their license, we don't have permission to share those images.


🖼️ Showcase

List of some projects people are building with Hugoplate! Don't forget to add yours.


💻 Need Customization?

If you need a custom theme, theme customization, or complete website development services from scratch, you can Hire Us.

About

Nordic CompBio - Website Dev

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages