logo标签列表

Blogger.com：如何在博客文章中嵌入格式化的代码片段？

javascriptcsshtmlblogs
5

我在blogger.com上有一个博客，想要在我的文章中格式化代码示例。

我需要使用什么来格式化博客文章中的代码片段？

在这里查看该帖子：https://dev59.com/g3RB5IYBdhLWcg3wQFPu#5615444。我使用它创建了这篇博客文章。 - R.S.K
https://www.sagapatra.in/2020/04/how-to-insert-code-snippet-in-blogger-articles.html - Arrow
6个回答
2
这是一篇关于如何在Blogger.com博客中进行语法高亮的教程，您可以访问这里了解详细步骤。
您可以尝试使用Hilite来将代码转换为可嵌入的格式，或使用Gist，这将是最简单的解决方案。
如果这些方法已经过时，您可以参考Formatting code snippets for blogging on Blogger。
在您的模板中添加语法高亮器，位置应该在</head>标签之前。
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/> 
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'></script> 
<script language='javascript'> 
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf';
SyntaxHighlighter.all();
</script>

"最初的回答" 只需要添加代码片段即可。
当我们的博客也使用 http 而不是 https 协议时，这个工作正常。Chrome 阻止所有从安全主机（https）到 http 的调用。是否有其他选择可以为 https 博客使用语法高亮器？ - Paramesh Korrakuti
1

@cdev 给出的答案是正确的，但已经过时。截至2021年6月，对我有效的代码是：

<link href='https://unpkg.com/@highlightjs/cdn-assets@11.0.1/styles/default.min.css' rel='stylesheet'/>
<script src='https://unpkg.com/@highlightjs/cdn-assets@11.0.1/highlight.min.js'/>
<script src='https://unpkg.com/@highlightjs/cdn-assets@11.0.1/languages/dart.min.js'/>
<script>
    hljs.configure({cssSelector: &quot;code&quot;});
    hljs.highlightAll();
</script>

这段代码需要添加到<head>标签之前。

默认情况下，突出显示的代码必须写在<pre><code></code></pre>下，如果您还想突出显示<code></code>之间的代码，则需要添加此行hljs.configure({cssSelector: &quot;code&quot;});

此行<script src='https://unpkg.com/@highlightjs/cdn-assets@11.0.1/languages/dart.min.js'/>将使dart代码得到突出显示。如果您使用的语言不是默认突出显示的，则可能需要添加类似的行。请查看supported languages

您可以在我的博客中查看此文章

1
你可以使用Highlight JS。
前往主题并编辑html，在“.”中放置以下代码。
<link href='//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/styles/atom-one-dark-reasonable.min.css' rel='stylesheet'/>
<script src='//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/highlight.min.js'></script>
<script src='//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/languages/r.min.js'></script>
<script>hljs.initHighlightingOnLoad();</script>

在<pre><code></code></pre>下编写您的代码。

或者，您可以使用gist.github.com创建要点，并将嵌入式代码复制到您的博客中。

1

语法高亮取决于您要突出显示的编程语言代码。不同的语言需要不同的突出显示。

最好使用第三方库来为您处理这些内容。

以下是有关如何在Blogger中执行此操作的教程：如何在Blogger帖子中格式化代码片段

0
你可以尝试：Carbon 我正在使用它，它是我用于此目的的最佳、最快和可编辑的工具。
虽然这个链接可能回答了问题，但最好在此处包含答案的基本部分并提供参考链接。如果链接页面更改，仅有链接的答案可能会失效。-【来自审查】 - Someone_who_likes_SE
0

语法高亮在博客上运行得非常完美。

但我建议你不要使用Blogger，现在有更好的替代选择（所有替代选择都像blogger一样免费）。 证据：在谷歌上搜索“最佳博客网站”，blogger将不会出现在其中。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接