插入图片希望添加快捷键

场景: 将有道云笔记迁移到思源笔记

需要逐个笔记进行拷贝粘贴, 万恶的有道云笔记不支持图片的拷贝(大图片),需要保存为本地图片在插入到思源笔记。

当前的问题: 思源笔记插入图片的菜单比较远,需要二级菜单才能点到对应的功能,操作起来耗时费力。

期望:

方案 1: 添加“插入图片”的快捷键

方案 2: 在工具栏添加“插入图片”按钮

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    23037 引用 • 92662 回帖 • 1 关注
  • Q&A

    提问之前请先看《提问的智慧》,好的问题比好的答案更有价值。

    8456 引用 • 38513 回帖 • 155 关注

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • 用桌面端,直接把(多个)图片文件拖进思源的文档里就行。

    另外在这里也能插入图片:

    image.png

  • 其他回帖
  • auric 1 赞同

    /tp,三个键就可以了 😂

  • EmberSky

    我简单写了一个 js 片段, 不知道能否符合你的要求

    // 增加按钮&快捷键实现: 插入图片或文件
    // 修改有标记的配置 "[可修改]"
    
    (async () => {
    
    /*******************************自定义配置**************************************/
        // 按钮id
        const btn_e = {
            /***********左上角**********/
            // 返回按钮(左箭头)
            barBack : "barBack",
            // 前进按钮(右箭头)
            barForward : "barForward",
            // 同步按钮
            barSync : "barSync",
            // 皇冠图标
            toolbarVIP : "toolbarVIP",
            // 日历热力图插件
            heatmap : "plugin_Calendar-heatmap_0",
            /***********右上角**********/
            // 搜索按钮
            barSearch : "barSearch",
            // 插件按钮
            barPlugins : "barPlugins",
            // 命令面板按钮
            barCommand : "barCommand",
            /***********左下角**********/
            // 底栏中的隐藏侧栏按钮
            barDock : "barDock",
            /***********右下角**********/
            // 底栏帮助按钮
            statusHelp : "statusHelp",
        }
    
        // 插入位置
        const position_e = {
            // 插入位置: 目标元素前面
            before : "beforebegin",
            // 插入位置: 目标元素后面
            after : "afterend",
        }
    
        // [可修改] 触发快捷键
        const hotkey = "ctrl+alt+g"
        // [可修改] 按钮 插入的位置 跟 哪个元素 有关
        const btn_basic_id = btn_e.barForward
        // [可修改] 按钮 插入到 元素 的前面还是后面
        const btn_post = position_e.after
        // [可修改] 按钮 的悬浮显示内容
        const btn_tips = "插入图片或文件"
    
    
    
    /*******************************代码分割线**************************************/
    
        const icon_e = {
            // 设置
            setting : "iconSettings",
            // 代码
            code : "iconCode",
            // 刷新
            refresh : "iconRefresh",
            // 调试
            debug : "iconBug",
            // 下方
            after : "iconAfter",
            // 下载
            download : "iconDownload",
        }
    
        // 快捷键监听
        document.addEventListener('keydown', event => {
            console.log("hotkey")
            if (checkShortcut(hotkey, event)) {
                // 阻止默认行为,比如浏览器的保存网页操作
                // event.preventDefault();
                quickInsertImgFunc()
            }
        });
    
        /* 重新加载会有延时, 所以需要等待1s之后再添加按钮 */
        setTimeout(() => {
            // 目标元素id, 插入位置, 新元素id, 显示内容, 图标, 点击回调
            addElement(btn_basic_id, btn_post, "custom_quick_inser_img", btn_tips, icon_e.download, quickInsertImgFunc);
        }, 1000);
    
        function checkShortcut(hostkey, event) {
            const keys = hostkey.split("+");
            const key = event.key.toLowerCase();
            const isCtrl = event.ctrlKey ? "ctrl+" : "";
            const isAlt = event.altKey ? "alt+" : "";
            const isShift = event.shiftKey ? "shift+" : "";
    
            const combination = isAlt + isCtrl + isShift + key;
            // console.log(keys.sort().join("+"))
            // console.log(combination)
            return keys.sort().join("+") === combination;
        }
    
        // 目标元素id, 插入位置, 新元素id, 显示内容, 图标, 点击回调
        function addElement(targetId, position, newElementId, displayContent, icon, clickCallback) {
            let barMode = document.getElementById(targetId);
            if (barMode === null) {
                return ""
            }
            barMode.insertAdjacentHTML(
                position,
                `<div id="${newElementId}" class="toolbar__item ariaLabel" aria-label="${displayContent}"></div>`
            );
            let newBtn = document.getElementById(newElementId);
            if (newBtn === null) {
                return ""
            }
            newBtn.innerHTML = `<svg><use xlink:href="#${icon}"></use></svg>`;
            newBtn.addEventListener("click", clickCallback);
            return newElementId
        }
    
    
        function quickInsertImgFunc() {
            const more_btn = document.querySelector('.layout__center [data-type="more"]:not([data-menu]');
            if (more_btn) {
                more_btn.click();
                setTimeout(() => {
                    const insert_btn = document.querySelector('#commonMenu > div.b3-menu__items > button:nth-child(1) > span > input');
                    if (insert_btn) {
                        insert_btn.click();
                    }
                }, 200);
    
            }
        }
    })()
    
    
  • 啥?我都是直接文件系统复制,进思源粘贴。。。。

推荐标签 标签

  • Jenkins

    Jenkins 是一套开源的持续集成工具。它提供了非常丰富的插件,让构建、部署、自动化集成项目变得简单易用。

    53 引用 • 37 回帖 • 2 关注
  • RIP

    愿逝者安息!

    8 引用 • 92 回帖 • 364 关注
  • Elasticsearch

    Elasticsearch 是一个基于 Lucene 的搜索服务器。它提供了一个分布式多用户能力的全文搜索引擎,基于 RESTful 接口。Elasticsearch 是用 Java 开发的,并作为 Apache 许可条款下的开放源码发布,是当前流行的企业级搜索引擎。设计用于云计算中,能够达到实时搜索,稳定,可靠,快速,安装使用方便。

    117 引用 • 99 回帖 • 210 关注
  • CloudFoundry

    Cloud Foundry 是 VMware 推出的业界第一个开源 PaaS 云平台,它支持多种框架、语言、运行时环境、云平台及应用服务,使开发人员能够在几秒钟内进行应用程序的部署和扩展,无需担心任何基础架构的问题。

    5 引用 • 18 回帖 • 172 关注
  • IPFS

    IPFS(InterPlanetary File System,星际文件系统)是永久的、去中心化保存和共享文件的方法,这是一种内容可寻址、版本化、点对点超媒体的分布式协议。请浏览 IPFS 入门笔记了解更多细节。

    21 引用 • 245 回帖 • 242 关注
  • 架构

    我们平时所说的“架构”主要是指软件架构,这是有关软件整体结构与组件的抽象描述,用于指导软件系统各个方面的设计。另外还有“业务架构”、“网络架构”、“硬件架构”等细分领域。

    142 引用 • 442 回帖
  • RabbitMQ

    RabbitMQ 是一个开源的 AMQP 实现,服务器端用 Erlang 语言编写,支持多种语言客户端,如:Python、Ruby、.NET、Java、C、PHP、ActionScript 等。用于在分布式系统中存储转发消息,在易用性、扩展性、高可用性等方面表现不俗。

    49 引用 • 60 回帖 • 361 关注
  • 反馈

    Communication channel for makers and users.

    123 引用 • 913 回帖 • 250 关注
  • 30Seconds

    📙 前端知识精选集,包含 HTML、CSS、JavaScript、React、Node、安全等方面,每天仅需 30 秒。

    • 精选常见面试题,帮助您准备下一次面试
    • 精选常见交互,帮助您拥有简洁酷炫的站点
    • 精选有用的 React 片段,帮助你获取最佳实践
    • 精选常见代码集,帮助您提高打码效率
    • 整理前端界的最新资讯,邀您一同探索新世界
    488 引用 • 384 回帖
  • 友情链接

    确认过眼神后的灵魂连接,站在链在!

    24 引用 • 373 回帖 • 1 关注
  • Netty

    Netty 是一个基于 NIO 的客户端-服务器编程框架,使用 Netty 可以让你快速、简单地开发出一个可维护、高性能的网络应用,例如实现了某种协议的客户、服务端应用。

    49 引用 • 33 回帖 • 24 关注
  • 程序员

    程序员是从事程序开发、程序维护的专业人员。

    574 引用 • 3533 回帖
  • 单点登录

    单点登录(Single Sign On)是目前比较流行的企业业务整合的解决方案之一。SSO 的定义是在多个应用系统中,用户只需要登录一次就可以访问所有相互信任的应用系统。

    9 引用 • 25 回帖
  • 外包

    有空闲时间是接外包好呢还是学习好呢?

    26 引用 • 232 回帖
  • ZeroNet

    ZeroNet 是一个基于比特币加密技术和 BT 网络技术的去中心化的、开放开源的网络和交流系统。

    1 引用 • 21 回帖 • 634 关注
  • 一些有用的避坑指南。

    69 引用 • 93 回帖 • 1 关注
  • CSS

    CSS(Cascading Style Sheet)“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    196 引用 • 540 回帖 • 1 关注
  • Sillot

    Insights(注意当前设置 master 为默认分支)

    汐洛彖夲肜矩阵(Sillot T☳Converbenk Matrix),致力于服务智慧新彖乄,具有彖乄驱动、极致优雅、开发者友好的特点。其中汐洛绞架(Sillot-Gibbet)基于自思源笔记(siyuan-note),前身是思源笔记汐洛版(更早是思源笔记汐洛分支),是智慧新录乄终端(多端融合,移动端优先)。

    主仓库地址:Hi-Windom/Sillot

    文档地址:sillot.db.sc.cn

    注意事项:

    1. ⚠️ 汐洛仍在早期开发阶段,尚不稳定
    2. ⚠️ 汐洛并非面向普通用户设计,使用前请了解风险
    3. ⚠️ 汐洛绞架基于思源笔记,开发者尽最大努力与思源笔记保持兼容,但无法实现 100% 兼容
    29 引用 • 25 回帖 • 89 关注
  • Quicker

    Quicker 您的指尖工具箱!操作更少,收获更多!

    34 引用 • 148 回帖
  • 学习

    “梦想从学习开始,事业从实践起步” —— 习近平

    171 引用 • 512 回帖
  • CongSec

    本标签主要用于分享网络空间安全专业的学习笔记

    1 引用 • 1 回帖 • 15 关注
  • flomo

    flomo 是新一代 「卡片笔记」 ,专注在碎片化时代,促进你的记录,帮你积累更多知识资产。

    5 引用 • 107 回帖
  • Facebook

    Facebook 是一个联系朋友的社交工具。大家可以通过它和朋友、同事、同学以及周围的人保持互动交流,分享无限上传的图片,发布链接和视频,更可以增进对朋友的了解。

    4 引用 • 15 回帖 • 439 关注
  • 宕机

    宕机,多指一些网站、游戏、网络应用等服务器一种区别于正常运行的状态,也叫“Down 机”、“当机”或“死机”。宕机状态不仅仅是指服务器“挂掉了”、“死机了”状态,也包括服务器假死、停用、关闭等一些原因而导致出现的不能够正常运行的状态。

    13 引用 • 82 回帖 • 61 关注
  • ZooKeeper

    ZooKeeper 是一个分布式的,开放源码的分布式应用程序协调服务,是 Google 的 Chubby 一个开源的实现,是 Hadoop 和 HBase 的重要组件。它是一个为分布式应用提供一致性服务的软件,提供的功能包括:配置维护、域名服务、分布式同步、组服务等。

    59 引用 • 29 回帖 • 14 关注
  • WiFiDog

    WiFiDog 是一套开源的无线热点认证管理工具,主要功能包括:位置相关的内容递送;用户认证和授权;集中式网络监控。

    1 引用 • 7 回帖 • 592 关注
  • Postman

    Postman 是一款简单好用的 HTTP API 调试工具。

    4 引用 • 3 回帖 • 9 关注