Giter Site home page Giter Site logo

heige-pcloud / notion-hugo Goto Github PK

View Code? Open in Web Editor NEW
121.0 1.0 15.0 534 KB

Use Notion as the CMS for your Hugo site

Home Page: https://notionhugo.pcloud.dev

License: GNU General Public License v3.0

TypeScript 98.64% HTML 1.36%
typescript notion cms hugo

notion-hugo's Introduction

Notion-Hugo

image

Notion-Hugo allows you to use Notion as your CMS and deploy your pages as a static website with Hugo. So you have the full power of Notion for creating new content, with Hugo and its wonderful ecosystem of themes take care of the rest for you.

Get Started

Create a new GitHub repository from this template

Click the green "Use this template" button in the upper-right corner to create your repo from this template. Choose "public" for the repository visibility.

Use this template button

Create a Notion integration

Visit my integrations and login with your Notion account.

Click on "Create new integration" to create a new internal integration.

Create new integration

In the capabilities section, select "Read Content" and "Read user information including email address". The "Read Content" permission is necessary for Notion-Hugo to pull your Notion content, and the "Read user information including email address" permission is used to fill front matters with author information. Notion-Hugo does not collect any of your information.

Setup capabilities

Click the submit button to finish creating the Notion integration.

Setup secrets for GitHub Action

Copy the Internal Integration Token.

Copy the Internal Integration Token

Navigate to the GitHub repo you just created, click on Settings -> Secrets -> Actions.

Click the "New Repository Secret" button on the top right.

Setup secrets for GitHub Action

Add a new secret with name NOTION_TOKEN, paste the copied token into the secret field. Click the green "Add secret" button to save the change.

Add secret NOTION_TOKEN

Duplicate the Notion Template

Duplicate this Notion Template into your own workspace.

Add connection to the Notion Page

Visit the page you just duplicated, click the ellipsis button on the top right and add the integration you just created as a connection.

Add connection to the Notion Page

Configure you Hugo site

On the page you just shared with the integration, click on the "share" button again, then click the "copy link" button on the bottom right to copy the link to this page.

Copy link

Now navigate back to your GitHub repository, open the notion-hugo.config.ts file, click to edit the file.

Edit the file on GitHub

Replace the page_url with the link you just copied.

Replace page_url

Click the commit changes button at the bottom to save the file.

Commit changes

Navigate to Settings -> Pages to enable GitHub Pages for your repository.

Enable GitHub Pages

There is one final step to make your website work correctly. Copy the url of your new website, then go to file config/_default/config.toml and change the baseURL from https://example.org/ to the url you just copied. Commit the changes and wait for your website to be deployed.

Now, visit your website and you will see your content from Notion is rendered into static webpages successfully.

Next Step

Visit the wiki to learn more about how to

  • Pick a different Hugo theme
  • Deploy to other platforms
  • Configure Notion-DoIt

FAQ

Will the notion-hugo blog be synced with me Notion?

Yes. By default, the notion-hugo blog will be re-generated every 1 hour through CD action in Github Actions. You can change this in .github/workflows/cd.yml using cron option:

name: CD

on:
  ...

  schedule:
    - cron: '0 * * * *' # run every hour

Be aware that Github will allow you to re-run the job no more often than once per 5 minutes.

What if I want to re-deploy immediately as Notion database updates?

This repo at the moment supports only cron option.

But, as an idea or direction - you could look for ways to listen for updates in Notion database and trigger Github Action when Notion database is updated. Usually webhooks are used for that purpose - but at the moment Notion has no official webhook support. So you would need to find a work around.

notion-hugo's People

Contributors

dependabot[bot] avatar heige-pcloud avatar vitalykrenel avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

notion-hugo's Issues

更改配置文件夹

大佬你好 ,请问如何使用 config 中的 DoIt 作为配置文件夹,而不是_default

Can't build

The deployment according to your Readme documentation was not successful. The issue is as shown in the image.
pic

[Feature] Sync `content` folder with Notion

  • Fetch new pages from Notion
  • Update pages with changed last_updated_time
  • Update pages whose media files might have expired
  • Delete pages that are not exists in Notion
  • Create a git commit

Notion-Hugo does not exist in Connections

I've cloned the template into my workspace, even moved it to the project itself. Neither place lets me find Notion-Hugo as a connection. And I did go to Connections > Add Connections

Did Notion take this down?

能否实现Notion写好,保存了,自动部署?

请问一下,现阶段是只能在Notion上写好文章,然后自己到Github上的Action中手动部署到网页吗?
还是说我这做法可以,但不是最优解?如果有,麻烦告知一声!谢谢!
目前我也在寻找一个更好的自动部署方法,希望大家可以交流一下!

Failed to get site pages.

I followed all the steps inside README, but failed on CD when getting the Notion page content.
Already check:

  1. Token already in GitHub Action secret.
  2. share link added into the notion-hugo.config.ts.
  3. add integration into shared page.

(However, I noticed that Notion changed how they share the page with integrated tools, like the picture below, so I added Notion-Hugo to the connection. I don't know if these changes caused the failure.)
image

BTW, thanks for the great work! 👍

Build with hugo 出现错误

image

麻烦问下如何解决?我是按照你的ReadME文档进行部署的。但是出现了以上错误。
错误提示是在工作区没找到用户,这是否跟我的notion是education plus版有关呢?因为这个版的notion是无法在work space里创建用户的。但是我使用了普通版本的notion,也是出现同样的提示。

Cant find integration user — results in build failed

image

I use Telegram to Notion bot to add posts to my database. The Telegram to Notion is connect as Notion Integration. For some reason notion.users.retrieve() cannot find integration user.

Unfortunately, Telegram to Notion does not have a "user" I could invite as guest to the database.

For the time being, I workarounded this way:

  1. Add field "authors" to the database — case is important.
  2. Add automation to Notion database: when page is added, specify your user as 'authors'

如何更改主题

按照hugo官方的主题指示,加了之后,部署的时候会提示没有相关的主题?不知道怎么操作

Warn unsupported block types using a custom shortcode

We are not going to support the following blocks.

  • template
  • synced_block
  • child_page
  • child_database
  • column
  • link_preview
  • column_list
  • link_to_page
  • breadcrumb
  • unsupported
  • table_of_contents

(See: https://developers.notion.com/reference/block)

We want to warn the user if their Notion document contains such blocks. Currently, the notion-to-markdown library simply outputs an empty string, which is not very helpful for debugging. We plan to add a custom unsupportedBlockHandler to notion-to-markdown and still output empty strings by default, but in Notion-Hugo, we will change it to output a custom notSupported shortcode. We will implement the notSupported shortcode to print an error message and abort the Hugo build process.

Reference:

https://gohugo.io/content-management/shortcodes/
https://gohugo.io/functions/fmt/errorf/

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.