- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
在我的网站上,我想向读者展示语法突出显示的代码。我正在使用 Tinymce 进行编辑。我正在使用 Mezzanine CMS,但我对 TinyMCE 了解不多。问题是当我选择预格式化来包装我的代码片段时,TinyMCE 用 <pre>
包装它标签,但 highlight.js 仅 highlightjs <pre><code> my-code-snippet </code></pre>
标签,即它只会突出显示由 pre 和代码标签包装的代码。
我现在的tinymce_setup.js文件是这样的
function CustomFileBrowser(field_name, url, type, win) {
tinyMCE.activeEditor.windowManager.open({
file: window.__filebrowser_url + '?pop=2&type=' + type,
width: 820, // Your dimensions may differ - toy around with them!
height: 500,
resizable: "yes",
scrollbars: "yes",
inline: "yes", // This parameter only has an effect if you use the inlinepopups plugin!
close_previous: "no"
}, {
window: win,
input: field_name,
editor_id: tinyMCE.selectedInstance.editorId
});
return false;
}
if (typeof tinyMCE != 'undefined') {
tinyMCE.init({
// main settings
mode : "specific_textareas",
editor_selector : "mceEditor",
theme: "advanced",
language: "en",
dialog_type: "window",
editor_deselector : "mceNoEditor",
// general settings
width: '700',
height: '350',
indentation : '10px',
fix_list_elements : true,
remove_script_host : true,
accessibility_warnings : false,
object_resizing: false,
//cleanup: false, // SETTING THIS TO FALSE WILL BREAK EMBEDDING YOUTUBE VIDEOS
forced_root_block: "p",
remove_trailing_nbsp: true,
external_link_list_url: '/displayable_links.js',
relative_urls: false,
convert_urls: false,
// callbackss
file_browser_callback: "CustomFileBrowser",
// theme_advanced
theme_advanced_toolbar_location: "top",
theme_advanced_toolbar_align: "left",
theme_advanced_statusbar_location: "",
theme_advanced_buttons1: "bold,italic,|,link,unlink,|,image,|,media,charmap,|,code,|,table,|,bullist,numlist,blockquote,|,undo,redo,|,formatselect,|,search,replace,|,fullscreen,",
theme_advanced_buttons2: "",
theme_advanced_buttons3: "",
theme_advanced_path: false,
theme_advanced_blockformats: "p,h1,h2,h3,h4,pre",
theme_advanced_styles: "[all] clearfix=clearfix;[p] small=small;[img] Image left-aligned=img_left;[img] Image left-aligned (nospace)=img_left_nospacetop;[img] Image right-aligned=img_right;[img] Image right-aligned (nospace)=img_right_nospacetop;[img] Image Block=img_block;[img] Image Block (nospace)=img_block_nospacetop;[div] column span-2=column span-2;[div] column span-4=column span-4;[div] column span-8=column span-8",
theme_advanced_resizing : true,
theme_advanced_resize_horizontal : false,
theme_advanced_resizing_use_cookie : true,
theme_advanced_styles: "Image left-aligned=img_left;Image left-aligned (nospace)=img_left_nospacetop;Image right-aligned=img_right;Image right-aligned (nospace)=img_right_nospacetop;Image Block=img_block",
advlink_styles: "intern=internal;extern=external",
// plugins
plugins: "inlinepopups,contextmenu,tabfocus,searchreplace,fullscreen,advimage,advlink,paste,media,table",
advimage_update_dimensions_onchange: true,
// remove MS Word's inline styles when copying and pasting.
paste_remove_spans: true,
paste_auto_cleanup_on_paste : true,
paste_remove_styles: true,
paste_remove_styles_if_webkit: true,
paste_strip_class_attributes: true,
// don't strip anything since this is handled by bleach
valid_elements: "+*[*]",
valid_children: "+button[a]"
});
}
我应该在我的 tinymce 设置中进行哪些更改,以便当我单击预格式化时我得到 <pre><code> </code></pre>
标签 ?
最佳答案
在 highlight.js 文档中找到了答案。这边http://highlightjs.org/usage/在自定义初始化下我找到了它。目前我已经把
<script>$(document).ready(function() {
$('pre').each(function(i, e) {hljs.highlightBlock(e)});
});</script>
就在结束正文标签之前。这将拾取在 pre 标签内找到的代码并突出显示它。
关于javascript - 如何在 highlight.js 中使用 tinymce?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22691225/
我有一个 NSButton带有图像(没有文本),在蓝色背景上。 样式为“Square”,类型为“Momentary Push In”,无边框等。 当我单击按钮时,它周围有一个光矩形,它会突出显示一秒钟
有没有办法用 highlight.js 强调线条? 例如,通过对它们进行不同的着色、更改背景颜色或其他方式。 最佳答案 您可以使用 HTML5 的 mark标签。 让我们以这段 Java 代码为例:
我试图用 highlight.js 做一个简单的例子,但我无法让它工作。我不熟悉highlight.js。这是我的代码,我不知道它有什么问题。任何的想法!提前致谢。 hljs.initHi
原标题是“特定于语言的配色方案防止较简单的配色方案为某些特定于语言的标签着色” 我正在使用 gVim 7.3(在 Ubuntu 12.04 Arch x86/64 上,这很重要)。 更新(2013-0
我将我认为有用的代码示例作为文本文件保存在我的计算机上。我将它们存储为 txt 文件而不是编写它们的语言,以便它们将在 Notepad++ 中打开而不是在编辑器中打开(即我不希望我的 c++ 示例在
所以我在网上搜索了这个问题的解决方案,但到目前为止还没有成功。我正在尝试根据 ASP.NET 中 GridView 中的“突出显示”行更新 SQL 数据库。这是我目前用于突出显示的代码。 //ASP.
如何配置 GitHub 的 Atom 以使其根据名称和/或扩展名自动为文件名设置特定的语法突出显示? 具体来说,我希望它自动将 Ruby 语法高亮设置为 Cocoapods 的 Podfile s。
真的需要一些建议。我正在尝试做几件事。1) 将表格 View 的第一个单元格设置为在第一次加载表格时突出显示。然后用户可以继续选择/突出显示表格中的其他单元格。如何第一次突出显示单元格? 2) 对一行
是否有一些现成的功能/宏可以帮助在不同颜色的源洞察中突出显示不同的单词(原始安装允许突出显示不同的单词,但都以相同的颜色)。 最佳答案 我正在寻找同样的东西。但是从sourceinsight官方引用来
在科莫多中,您的代码块用垂直虚线突出显示,如下图所示 . geany有类似的东西吗? 最佳答案 由于这里没有人回答我,我写信给 geany 邮件列表,他们也向我展示了如何在 geany 中获取它:它被
我正在寻找一个用 JavaScript 编写的全面的语法高亮器,它会自动检测所使用的语言并应用正确的语法高亮。 我从一个简单的谷歌搜索中找到了无数,但它们都必须在 上有某种格式化的类。元素如 .
我正在使用 Lucene 的 Highlighter 类来突出显示匹配搜索结果的片段,并且效果很好。我想从使用 StandardAnalyzer 搜索切换到 EnglishAnalyzer,它将执行词
无论文件类型如何,我都想突出显示某个单词。在我的 .vimrc 中,我添加了: highlight link notes todo syntax match notes contained "TODO
我将 jupyter notebook 与 python 一起使用 db.py 库进行数据库查询。 例如,它可能看起来像(在我的代码单元中): df = db.query(""" SELECT a,b
Closed. This question is off-topic。它当前不接受答案。 想要改善这个问题吗? Update the question,所以它是用于堆栈溢出的on-topic。 已关闭
我如何让它工作,我确实在 nano.rc 和 .nanorc 中添加了颜色语法突出显示配置,但没有任何 react 。 最佳答案 将名为 HOME 的环境变量设置到您的用户目录(cd ~ 将您置于例如
是否可以在 pre 标签中添加一个类来禁用代码高亮?我尝试添加类 prettyprint-false 和 no-prettyprint。 https://code.google.com/p/googl
我在 TextMate2 中工作,但这个问题也可能适用于其他文本编辑器。 我的脚本在 R 中。我打算在脚本上使用 rmarkdown::render() 来创建一个 "report" . 这些报告的聪
我需要在我的网站上发布SAS代码。但是,如果我确实编写HTML来突出显示SAS cod,那将花费我很长时间。 如何将SAS代码转换为外观漂亮的HTML副本? 最佳答案 我只是将您的编辑器中的内容复制/
我想在另一个扩展名上强制突出显示HTML语法(我的一位同事已决定为其模板文件使用其他文件命名方案)。 在其他编辑器中,可以手动选择,但Textmate似乎不适合我。如何使这些.randomtexten
我是一名优秀的程序员,十分优秀!