博客 rss 如何使用
With the recent exodus from Medium many developers are now creating their own GatsbyJS Blogs and then cross-posting to Medium or publications like and dev.to.
随着Medium最近的离职,许多开发人员现在正在创建自己的GatsbyJS Blog,然后交叉发布到Medium或诸如和dev.to之类的出版物。
Cross-posting is time consuming, but necessary to drive traffic to your personal site. Let's look at how we can automate this by adding an RSS feed to your personal GatsbyJS blog.
交叉发布非常耗时,但是对于将流量吸引到您的个人站点是必需的。 让我们看看如何通过在您的个人GatsbyJS博客中添加RSS提要来实现此目的的自动化。
将规范URL添加到您的博客 (Add Canonical URL's to Your Blog)
What is a canonical url?
什么是规范网址?
A canonical url tells search engines which page is the primary or authorative page when duplicate content is found (ie. cross-posting).
当发现重复的内容(即交叉发布)时,规范的网址会告诉搜索引擎哪个页面是主要页面或权威页面。
Let's install gatsby-plugin-canonical-urls
让我们安装gatsby-plugin-canonical-urls
Quick tip:npm i
is an alias fornpm install --save
快速提示:npm i
是npm install --save
的别名
npm i gatsby-plugin-canonical-urls
Note:If you are usinggatsby-plugin-react-helmet
install this plugin instead: gatsby-plugin-react-helmet-canonical-urls*
注意:如果您使用的是gatsby-plugin-react-helmet
请安装此插件: gatsby-plugin-react-helmet-canonical-urls *
npm i gatsby-plugin-react-helmet-canonical-urls
Add plugin configuration to/gatsby-config.js
将插件配置添加到/gatsby-config.js
// In your gatsby-config.jsplugins: [{resolve: `gatsby-plugin-canonical-urls`,// or// resolve: `gatsby-plugin-react-helmet-canonical-urls`options: {// Change `siteUrl` to your domain siteUrl: `https://tueri.io`// Query string parameters are inclued by default.// Set `stripQueryString: true` if you don't want `/blog` // and `/blog?tag=foobar` to be indexed separatelystripQueryString: true}}]
With this configuration, the plugin will add a<link rel="canonical" ... />
to the head of every page e.g.
使用此配置,插件将在每个页面的开头添加<link rel="canonical" ... />
,例如
<link rel="canonical" href="https://tueri.io/-04-04-how-to-securely-deploy-to-kubernetes-from-bitbucket-pipelines/" />
安装RSS Feed生成器 (Install an RSS Feed Generator)
We'll use gatsby-plugin-feed to generate an rss feed from our blog posts.
我们将使用gatsby-plugin- feed从我们的博客帖子中生成一个rss feed。
npm i gatsby-plugin-feed
Add plugin configuration to/gatsby-config.js
将插件配置添加到/gatsby-config.js
// In your gatsby-config.jsplugins: [{resolve: `gatsby-plugin-feed`,options: {query: `{site {siteMetadata {titledescriptionsiteUrlsite_url: siteUrl}}}`,feeds: [{serialize: ({ query: { site, allMarkdownRemark } }) => {return allMarkdownRemark.edges.map(edge => {return Object.assign({}, edge.node.frontmatter, {description: edge.node.excerpt,date: edge.node.frontmatter.date,url: site.siteMetadata.siteUrl + edge.node.fields.slug,guid: site.siteMetadata.siteUrl + edge.node.fields.slug,custom_elements: [{ "content:encoded": edge.node.html }],})})},query: `{allMarkdownRemark(sort: { order: DESC, fields: [frontmatter___date] },) {edges {node {excerpthtmlfields { slug }frontmatter {titledate}}}}}`,output: "/rss.xml",title: "Your Site's RSS Feed",// optional configuration to insert feed reference in pages:// if `string` is used, it will be used to create RegExp and then test if pathname// of current page satisfied this regular expression;// if not provided or `undefined`, all pages will have feed reference insertedmatch: "^/blog/",},],}}]
NOTE:This plugin will only generates thexml
file(s) when run inproduction
mode! To test your feed, run:gatsby build && gatsby serve
注意:此插件仅在production
模式下运行时才会生成xml
文件! 要测试您的供稿,请运行:gatsby build && gatsby serve
Here's what our feed looks like: Tueri.io's RSS Feed
这是我们的feed的样子: Tueri.io的RSS feed
For more information on configuring your feed check out the plugin docs.
有关配置Feed的更多信息,请查看插件文档 。
将dev.to连接到您的RSS feed (Connect dev.to to Your RSS Feed)
Log in to your dev.to account
登录到您的dev.to帐户
Go to: Settings > Publishing from RSS or https://dev.to/settings/publishing-from-rss
转到:设置>从RSS或https://dev.to/settings/publishing-from-rss发布
Add your "RSS Feed URL" e.g. https://tueri.io/rss.xml
添加您的“ RSS Feed URL”,例如https://tueri.io/rss.xml
Check "Mark the RSS source as canonical URL by default选中“默认情况下将RSS源标记为规范URL Click "Update"点击“更新”
将媒介连接到您的RSS Feed (Connect Medium to Your RSS Feed)
The connection for Medium is not quite as straight-forward, but simple enough using Zapier.
Medium的连接不那么直接,但是使用Zapier足够简单。
Head on over to Zapier and create a free account.
前往Zapier并创建一个免费帐户。
“做个炸弹” ("Make a Zap")
Choose "RSS" as your "Trigger App"选择“ RSS”作为“触发应用程序” Select "New Item in Feed"选择“ Feed中的新项目” Paste in your "Feed URL"粘贴到“ Feed URL”中 Select a sample from your feed.从Feed中选择一个样本。 Choose "Medium" as your "Action App"选择“中”作为“动作应用” Select "Create Story"选择“创建故事” Authorize your Medium account授权您的中型帐户 Select your fields: make sure you select your Canonical URL选择您的字段:确保选择您的规范URL Send a test to Medium发送测试到中 Finish and turn on your Zap完成并打开您的Zap结论 (Conclusion)
Make sure Google gives you credit for your content by using Canonical URL's.
确保Google通过使用规范网址将内容归功于您。
I hope you found this helpful and that it saves you lots of time cross-posting your content!
希望对您有所帮助,这样可以节省您交叉发布内容的大量时间!
Originally published at Tueri.io
最初发表于Tueri.io
翻译自: /news/how-to-automatically-cross-post-from-your-gatsbyjs-blog-with-rss/
博客 rss 如何使用