首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何在WordPress的古腾堡编辑器的<li>元素中插入图像?

在WordPress的古腾堡编辑器中,可以通过以下步骤在<li>元素中插入图像:

  1. 打开WordPress后台,进入编辑文章或页面的界面。
  2. 在古腾堡编辑器中,找到需要插入图像的<li>元素所在的段落。
  3. 将光标定位到<li>元素内的合适位置。
  4. 在古腾堡编辑器的工具栏中,点击“添加块”按钮(加号图标)。
  5. 在弹出的块选择器中,选择“图像”块。
  6. 点击“上传”按钮,选择要插入的图像文件并上传。
  7. 上传完成后,选择插入的图像块,并在右侧的设置面板中进行相关设置,如对齐方式、图像大小等。
  8. 点击“应用”按钮,图像将被插入到<li>元素中。

这样,你就成功在WordPress的古腾堡编辑器的<li>元素中插入了图像。

另外,如果你使用腾讯云的WordPress云托管服务,可以使用腾讯云对象存储(COS)来存储和管理你的图像资源。腾讯云对象存储(COS)是一种高可用、高可靠、低成本的云存储服务,适用于各种场景下的数据存储和传输。你可以将图像上传到腾讯云对象存储(COS),然后在WordPress中通过插件或自定义代码来引用这些图像。详情请参考腾讯云对象存储(COS)的产品介绍:腾讯云对象存储(COS)

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

WordPress 5.7 发布,更好用编辑器

WordPress 5.7 发布,新版本改善了编辑器编辑体验,并使用户能够轻松创建更多高级块,并为块编辑器添加更强大自定义项,还有 HTTPS 切换等其他功能改进​。...编辑器更易使用 增强字体调整:编辑器很多地方都可以调整字体,比如列表,代码等块,并且无需切换界面。 增强可重用块,更加稳定,更好用,并且支持自动保存。...支持拖放:支持将块和块组从插入器中直接拖放到编辑器。 更多块 不懂代码也可以实现功能,做更多事情。 封面块:可以制作一个填充整个窗口封面块。...更简单默认调色板 全新简化调色板参照 WCAG 2.0 AA 推荐白色或黑色对比度将 WordPress 源代码所有颜色分解为 7 种核心颜色和 56 种阴影。...一键切换 HTTP 到 HTTPS 从现在开始,将站点从 HTTP 切换到 HTTPS,只需一次点击,WordPress 会自动更新数据库 URL,无需自己去做更多处理了。

73420
  • WordPress 5.6 发布,新 2021 主题和编辑器大更新

    WordPress 5.6 发布,这个版本发布了新默认主题 2021,然后给增加大量模块,让你更加方便插入图片,声音和视频。...编辑器更新 更灵活布局:编辑器更加方便设置布局,支持单栏或者多栏,支持固定宽度,全屏头部,背景图支持渐变。...更好视频字幕:为了帮助大家想视频添加字幕,您现在可以在帖子或页面中上传字幕。这样,比以往任何时候都更容易使需要或喜欢使用字幕任何人都可以访问您视频。...2021主题 2021 是一个完全为全新编辑器创建主题,并且带有自己专属快模式,花几秒钟试试它不同布局,就可以让你文章脱颖而出。...虽然 WordPress Core 自动更新功能已在 WordPress 存在多年,但是 WP 5.6 首次引入了新用户界面,以使用户对自动更新操作更加容易。

    85240

    常用短代码插件:WPJAM Basic 短代码扩展

    很多国内主题只针对WP经典编辑器做了扩展,而编辑器却要屏蔽(虽然我认为编辑器功能极其强大,完爆经典编辑器。)...,经典编辑器很多内容无法自己生成,例如表格之类,所以这款免费插件就能帮你! 温馨提示:请将以下代码开头 # 替换成 [ 否则将无法正常使用!...WPJAM Basic 常用短代码扩展内置了一些可能经常使用到「短代码」(Shortcode),让你在编辑文章时候插入复杂格式内容更加方便,目前支持短代码(Shortcode)有这些: email...@email.com list 为了偷懒,不想输入 ,通过下面的方法快速插入列表: #list] item-a item-b item-c [/list] 每一行为一个元素,默认是无序列表...,如果要插入有序列表,加入 type="order" 属性: #list type="order"] item-a item-b item-c [/list] table 在 WordPress 后台代码模式下输入表格

    1.3K30

    WPJAM TinyMCE:一键增强 WordPress 经典编辑器

    现在大家都开始使用编辑器了,特别是 WordPress 最新几个版本发行,大部分更新都围绕编辑器,不过在一些地方还是有用到经典编辑器,比如我们花生小店商品编辑,就用不到那么高级编辑器...经典编辑器基本够用,但是有些格式化工具缺失,还是挺烦人,所以我们为了商家在花生小店时候方便编辑商品,我们做了一个 WordPress 经典编辑器增强插件,为了方便就叫做 WPJAM TinyMCE。...安装 WPJAM TinyMCE 之前编辑器: 安装 WPJAM TinyMCE 之后编辑器: 新增插入表格功能 我增加了 TinyMCE 表格插件,让大家在编辑器就能够直接插入表格: 还支持表格行...直接插入屏幕截图 对于我们技术类型博客来说,在写说明时候插入屏幕截图,是非常常见操作,之前可能需要用到一些截图软件,把截图保存到电脑桌面,然后再上传到 WordPress 媒体库。...现在在屏幕截图之后,只需要按快捷键就能粘贴到编辑器里面,然后文章保存时候自动把图片上传到媒体库。非常方便快捷。

    82510

    展望 WordPress 5.0 会给我们带来哪些更新?

    (Gutenberg)编辑器 Gutenberg,,1397 年出生于德国,是西方国家活字印刷术发明人,从而引导了一次媒介革命,其历史地位与中国毕昇比肩(当然,比毕昇晚了 400...多年),全名叫约翰内斯·WordPress编辑器取名古意在向这段历史致敬。...()。...至此,我相信读者已经发现一个特点,那就是操作都是围绕块(Block)进行,这也是新版编辑器一个理念。...目前互联网上一些自媒体平台都是采用这种理念,比如国际知名写作平台 Medium Medium 编辑界面 以上,便是关于 WordPress 新版编辑器 Gutenberg- 基本介绍,更多新功能和玩法大家可以自行安装体验

    1.4K30

    屏蔽 WordPress 编辑器,换回经典编辑器

    WordPress 5.0 带来编辑器(英文名是 Gutenberg)非常酷,也叫做块编辑器(block editor),它把内容当作一块一块来处理,每一块有自己设置,使用起来非常清晰好用:...编辑器使用不习惯 但是习惯是一件很难改变事情,很多人习惯了经典编辑器,对于编辑器总是用不习惯。...可能编辑器大部分界面都是关注内容部分,对于摘要,特色图片,分类这些都放到侧边,并且默认隐藏,这个造成了很多人非常不习惯,甚至不知道哪里去设置。...我为了习惯编辑模式,我把很多针对文章操作都移到了文章列表,比如在后台文章列表设置文章特色图片,设置文章摘要,一键上传外部图片等,让编辑器专注于文章内容管理。...如何屏蔽编辑器 为了兼容,WordPress 官方也提供了 Classic Editor 插件,可以通过各种方式在编辑器和经典编辑器切换使用: 管理员可以设置默认编辑器

    41920

    WordPress 禁用 Rest API 默认路由兼容 Gutenberg 编辑器

    禁用 WordPress Rest API 默认路由后有利于 WordPress 站点安全及避免暴露网站所有内容,所有子凡所有 WordPress 网站都是直接禁用了 WordPress 默认路由,...但是由于 WordPress 默认使用块编辑器 Gutenberg),所有如果直接使用代码禁用 WordPress Rest API 默认路由就会导致后台编辑器无法正常使用。...故此子凡就来分享一个兼容 WordPress 编辑器情况下,对外也能够禁用 WordPress rest api,具体代码如下: add_action('plugins_loaded',function...(){//兼容 编辑器 global $post; if( !...需要说明是,以上代码主要实现原理就是判断用户是否登录以及是都有编辑权限,只有当用户登录,且拥有文章编辑权限用户才不会禁用默认路由,以达到兼容编辑器目的,当然如果你像子凡一样只用 WordPress

    71390

    WordPress 5.5 发布,关键词:速度,搜索,安全

    WordPress 5.5 发布,这个版本在「速度」、「搜索」、「安全」这三个方面加强了网站能力: 速度 图片给网站增添了很多光彩,同时也让网站变得很慢,WordPress 5.5 使用了传说中“懒加载...搜索 WordPress 5.5 默认提供了一个 XML sitemap 文件,具体怎么工作,还没仔细了解,我之后会把 WPJAM Basic 「简单SEO」扩展基于该功能,进行升级。...编辑器 块模式:通过使用文本和媒体组合来创建复杂精美的布局。 新块目录:在后台编辑器就可以选择各种好用好玩“块”。 内联图像编辑:使用「图像块」就能直接裁剪,旋转和缩放照片。...」错误。...WordPress 已经换成了 allowed_options,WPJAM Basic 最新版已经做了兼容了,接下来,我将针对 WordPress 5.5 最新功能,进行优化。

    42130

    WordPress 6.2 发布,全面提升站点编辑体验

    WordPress 6.2 版本今天发布了,新版全面提升了站点编辑器体验,引入了更多网站设计功能,并提供了新无干扰写作模式。...更流畅区块插入器 区块插入器也有了全新设计,让用户可以更容易访问到自己所需内容,新增「媒体」选项卡可以直接拖放现有媒体库内容,另外它拆分视图可以同时浏览区块类别和查看预览,从而更快查找到所需区块模板...在编辑器直接使用 Openverse 资源 Openverse 已经有超过了 7 亿免费和公开许可图片和音频,现在通过区块插入器直接集成到 WordPress 编辑器。 ...无干扰模式专注写作 编辑器也支持无干扰写作模式了,可以一键隐藏侧边栏,所有面板和控件等,专注自己创作。...简单说 WordPress 6.2 主要更新就是编辑器更新,没有类似 WordPress 6.1 无需第三方插件就能实现首页 0 SQL 这个大更新。

    1.1K40

    如果你 WordPress 安装了 PHP Everywhere 插件,请赶快升级或者删除

    如果你 WordPress 安装了 PHP Everywhere,那么你要赶快升级到 3.0 版本或者删除了,因为近日该插件被披露存在三个严重安全漏洞,攻击者可在受影响网站上利用该漏洞,执行任意代码...PHP Everywhere 插件 PHP Everywhere 可以让你在 WordPress 随时随地使用 PHP 代码,使用户能够在 WordPress 文章,页面和侧边栏插入和执行 PHP...代码,根据 WordPress 官方插件库数据,该插件已被 3 万多个 WordPress 站点使用。...CVE-2022-24665 - 通过编辑器块进行远程代码执行(同样需要贡献者权限) 如果网站存在这三个漏洞,黑客将可以利用它们并执行恶意 PHP 代码,甚至可以实现对网站完全接管。...3.0.0 版本通过移除短代码功能,并且提供一个升级向导,将旧短代码升级到 Gutenberg 编辑器里面的块(block)。但是 3.0.0 版本只支持编辑器,不再支持原来经典编辑器了。

    40130

    WordPress新添加一个编辑器

    WordPress添加一个额外编辑器(Gutenberg Editor)实例可以通过自定义代码实现。以下是一个基本步骤指南,帮助你在WordPress添加第二个编辑器实例。...title', 'editor'), ));}add_action('init', 'custom_gutenberg_editor_init');步骤 2: 创建自定义JavaScript文件在你插件文件夹创建一个...; });})(jQuery);步骤 3: 添加自定义编辑器容器在你主题文件(例如 functions.php 或 header.php),添加一个容器来承载第二个编辑器实例。步骤 4: 激活插件在WordPress后台,导航到“插件”页面,找到你创建自定义插件并激活它。步骤 5: 测试访问你网站,并检查页面底部是否出现了第二个编辑器实例。...注意事项性能影响:添加额外编辑器实例可能会对性能产生影响,特别是在低配置服务器上。兼容性:确保你代码与当前使用WordPress版本兼容。

    7710

    WPJAM Basic 去掉了「屏蔽 REST API」功能

    自带 REST API,那就在 WPJAM Basic 「优化设置」添加了屏蔽 REST API 功能,觉得自己不用,就增加个选项可以勾选去掉。...随着 WordPress 版本推进,功能叠加,功能也产生了依赖,WordPress REST API 成为很多功能基础,比如编辑器就是基于 REST API ,所以很多人在 WPJAM Basic...「优化设置」把 REST API 功能屏蔽了,然后发现没法用了,就来怼我:装了 WPJAM Basic,都不能用了。...所以很无语,虽然在「优化设置」已经做了处理,勾选了「屏蔽」才能勾选「屏蔽 REST API」,但是不知道什么原因,可能其他插件或者主题把编辑器屏蔽了,然后所有的罪都由 WPJAM Basic...return_false'); add_filter('rest_jsonp_enabled','__return_false'); // 移除头部 wp-json 标签和 HTTP header

    45620

    禁用 WordPress Auto Embeds 功能,加快页面解析速度

    有没有想过,只需要在文章输入一个视频网站或者图片分享 URL,这个 URL 里面含有的视频或者图片就自动显示出来?这样是不是很方便。...WordPress Easy Embeds 功能 这个就是 WordPress Easy Embeds 功能,可以让我们直接发布一个 URL(需要单独一行,纯文本,不带链接才行),就能把这个...URL 视频显示到博客上,并且会根据博客布局调整视频大小。...就会自动把这个 URL 转化成 TED 对应页面的视频: 如果你是用 WordPress 编辑器,那么在编辑器可以看到目前支持自动嵌入服务: 点击上图按钮,点击对应按钮: 输入链接...,然后点击潜入,也可以一键嵌入: 禁用 WordPress Auto Embeds 功能 从编辑器默认潜入按钮, WordPress Easy Embeds 支持自动嵌入网站大部分都是国外网站

    1.2K20

    Wordpress如何禁用编辑器,使用传统经典编辑器

    编辑器和经典编辑器到底哪个更好用?这个因人而异,每个人习惯都不相同,选择适合自己就好了。...悦然网络工作室为客户制作企业网站都是使用新版wordpress程序,而新版早就全面启用了编辑,这是一种模块化编辑器,其实是非常好用,不过也有一些用户不太习惯,还是想换回以前常见那种编辑器。...二、使用网站模板自带功能 有些wordpress网站模板中集中了经典编辑器切换开关,大家只需要设置一下就可以了。...操作如下: 登陆网站后台,依次点开“网站优化”-“WP优化”,然后在右侧看到会有一个“禁用编辑器开关,把它打开就可以返回经典编辑器了。...如上图,经典编辑器就是这个样式,就是我们常见那种,其实不管是哪种编辑器,它都只是我们编辑内容一个工具而已,对网站建设、SEO优化没什么关系,一切只看各人习惯,习惯用哪个就用哪个吧

    1.4K00

    WordPress 推出了全新区块样板构建器

    不过你多喜欢和怀念经典编辑器WordPress 已经在编辑器路上狂奔了,为了让大家更加方便使用编辑器,现在 WordPress.org 推出了全新区块样板构建器,这个距离 WordPress.org...站点编辑器,直接使用。...下图就是 WordPress.org 官方区块样板目录列表页: 鼠标移到每个样板上,就会显示「Copy」按钮,点击就会可以复制该区块样板,然后切换到自己 WordPress 后台,在编辑器中直接粘贴即可...与 WordPress.org 其他东西一样,一旦提交到 WordPress 区块样板目录,这些样板就可供公众使用。...最后需要简单说一下,WordPress 区块样板,基本都可以运行在所有的 WordPress 主题,但是在一些针对堡主题,可能运行更好,比如你可以尝试一下默认 2022 主题来测试这些区块样板

    39040

    屏蔽 WordPress 小工具区块编辑器模式,切换回经典模式

    通过 WPJAM Basic 屏蔽 WordPress 编辑器,换回经典编辑器之后,WordPress 小工具还是区块编辑模式,本来我想在屏蔽编辑器时候,同时也屏蔽小工具区块编辑器模式...不过提供一下如何禁用 WordPress 小工具区块编辑器模式,切换回经典模式方法,一共有三种: 一、使用 remove_theme_support 函数 主题可以通过调用 remove_theme_support...( 'widgets-block-editor' ) 来屏蔽小工具区块编辑器模式,在主题 functions.php 文件添加如下代码: add_action('after_setup_theme...三、使用 use_widgets_block_editor filter use_widgets_block_editor 过滤器接口是用来控制是否启用小工具区块编辑器模式。...比如可以通过以下代码屏蔽小工具区块编辑器模式: add_filter('use_widgets_block_editor', '__return_false'); 使用过滤器接口,就有更多可定制性,可以加入一些自定义功能

    28810

    WPJAM「代码高亮」:一键实现 WordPress 页面代码高亮显示

    整个插件自己写代码只有不到 30 行,就是利用 WordPress wp_enqueue_scripts 接口让页面加载 prism 样式和脚本代码。...然后插件也兼容 WPJAM「静态文件」插件,不单独加载 prism 样式和脚本代码,把 prism 样式和脚本代码合并到整个站点唯一样式和脚本文件: 所以这个从另外一个侧面说明 WPJAM 出品插件...非常简单,首先根据你使用不同编辑器略用不同。...如果你使用编辑器的话,先点击选择创建一个代码块: 然后输入代码,选择该该区块: 点击右侧区块属性框,在额外CSS类输入:language-php,如果你代码是 JS 则,输入 language-javascript...定义就是语言,如何设置,和上面设置方式是一样,自己灵活处理一下,个人感觉还是编辑器方便一点。

    1.8K30

    WordPress 5.0默认老版编辑器

    方法3一句代码禁用Gutenberg 编辑器其实之前经典Classic Editor编辑器代码,在WordPress 50并没有被删除,上述插件也只是个切换开关而已。...虽然看起来很高端,但很多用户发现它很不方便,相比之下,还是更喜欢经典编辑器。如果经典编辑器真的被5.0版本取代了,如何禁用Gutenberg并保留经典WordPress编辑器呢? ?...Gutenberg是即将推出WordPress编辑器,其目的是使WordPress写作体验现代化。它尝试像页面构建器插件一样工作,允许将项目拖放到文章或页面。...尽管有负面评论,但WordPress核心团队正在努力使Gutenberg成为WordPress 5.0默认编辑器。这让很多用户非常担心,他们希望有一个选项来禁用Gutenberg并保留经典编辑器。...方法3:一句代码禁用Gutenberg(编辑器 其实之前经典Classic Editor编辑器代码,在WordPress 5.0并没有被删除,上述插件也只是个切换开关而已。

    1.3K10

    WordPress 5.0后版本退回旧版编辑器方法

    WordPress更新到5.0版本之后,新加入了Gutenberg编辑器(或称block 编辑器),取代了之前一直使用经典编辑器。尝试了一下啊 发现真的是非常不好用。...这个新编辑器将所有的元素(段落、图片、代码、表格等)化成区块表示,区块之间顺序可以调换,然而这些区块做实在是太不人性化了,完全不符合国人使用习惯。...禁用方法方法一:下载Disable Gutenberg 插件或者Classic Editor插件可以关闭这个编辑器方法二:在模板 functions.php 文件,加入如下代码:add_filter...('use_block_editor_for_post', '__return_false'); // 禁止加载Gutenberg(编辑器remove_action( 'wp_enqueue_scripts

    56330
    领券