定制 xetaio/xetaravel-editor-md 二次开发

按需修改功能、优化性能、对接业务系统,提供一站式技术支持

邮箱:yvsm@zunyunkeji.com | QQ:316430983 | 微信:yvsm316

xetaio/xetaravel-editor-md

Composer 安装命令:

composer require xetaio/xetaravel-editor-md

包简介

A wrapper to use Editor.md with Laravel.

README 文档

README

Xetaravel Editor.md

Stable Version Downloads Laravel License
Latest Stable Version Total Downloads Laravel 5.6 License

A wrapper to use Editor.md with Laravel.

Requirement

PHP

Installation

composer require xetaio/xetaravel-editor-md

ServiceProviders

Import the EditorServiceProvider in your config/app.php:

'providers' => [
    //...
    Xetaio\Editor\EditorServiceProvider::class,
    //...
]

Vendor Publish

Publish the vendor files to your application (included the config file config/editor.php and the public/vendor/editor.md directory) :

php artisan vendor:publish --provider="Xetaio\Editor\EditorServiceProvider"

Configuration

All configuration options can be found in your config/editor.php file. For a full configuration options, read the documentation on the Editor.md site.

Usage

To use it with the basic options, just use the helpers included with the plugin:

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Editor.md example</title>
   {!! editor_css() !!}
</head>
<body>
    <h2>Editor.md example</h2>

    <div id="editormd">
        <!-- You must hide it with `display:none;` -->
        <textarea class="form-control" name="content" style="display:none;">
            # Editor.md for Laravel
        </textarea>
    </div>

    {!! editor_js() !!}
    {!! editor_config(['id' => 'editormd']) !!}
</body>
</html>

Advanced usage

If you want to use your custom options or options that are not in the config file, one of the best way, it to setup your Editor like that :

<!-- layouts/app.blade.php -->
<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Editor.md example</title>

   <!-- Embed Styles -->
   @stack('styles')
</head>
<body>
   <!-- Content -->
   @yield('content')

   <!-- Embed Scripts -->
   @stack('scripts')
</body>
</html>
<!-- controller/my_view.blade.php -->
@extends('layouts.app')

@push('styles')
   {!! editor_css() !!}
@endpush

@push('scripts')
   {!! editor_js() !!}

   @php
       $config = [
           'id' => 'commentEditor',
           'height' => '350',
           // Others settings here...
       ];
   @endphp

   @include('editor/partials/_comment', $config)
@endpush

@section('content')
//...
<div id="commentEditor">
   <textarea class="form-control" required="required" style="display:none;" name="content"></textarea>
</div>
//...
@endsection
<!-- editor/partials/_comment.blade.php -->
<script type="text/javascript">
var _{{ array_get($config, 'id', 'myeditor') }};
$(function() {
   editormd.emoji = {
       path : "{{ array_get($config, 'emojiPath', config('editor.emojiPath')) }}",
       ext : ".png"
   };
   _{{ array_get($config, 'id', 'myeditor') }} = editormd({
       id : "{{ array_get($config, 'id', 'myeditor') }}",
       width : "{{ array_get($config, 'width', config('editor.width')) }}",
       height : "{{ array_get($config, 'height', config('editor.height')) }}",
       saveHTMLToTextarea : {{ array_get($config, 'saveHTMLToTextarea', config('editor.saveHTMLToTextarea')) }},
       emoji : {{ array_get($config, 'emoji', config('editor.emoji')) }},
       taskList : {{ array_get($config, 'taskList', config('editor.taskList')) }},
       tex : {{ array_get($config, 'tex', config('editor.tex')) }},
       toc : {{ array_get($config, 'toc', config('editor.toc')) }},
       tocm : {{ array_get($config, 'tocm', config('editor.tocm')) }},
       codeFold : {{ array_get($config, 'codeFold', config('editor.codeFold')) }},
       flowChart: {{ array_get($config, 'flowChart', config('editor.flowChart')) }},
       sequenceDiagram: {{ array_get($config, 'sequenceDiagram', config('editor.sequenceDiagram')) }},
       path : "{{ array_get($config, 'path', config('editor.path')) }}",
       imageUpload : {{ array_get($config, 'imageUpload', config('editor.imageUpload')) }},
       imageFormats : {!! array_get($config, 'imageFormats', json_encode(config('editor.imageFormats'))) !!},
       imageUploadURL : "{{ array_get($config, 'imageUploadURL', config('editor.imageUploadURL')) }}?_token={{ csrf_token() }}&from=xetaravel-editor-md",
       pluginPath : "{{ asset(array_get($config, 'pluginPath', config('editor.pluginPath'))) }}/",
       watch : false,
       editorTheme : 'mdn-like',
       placeholder : 'Type your comment here...',
       toolbarIcons : function () {
           return [
               "undo", "redo", "|",
               "bold", "italic", "quote", "|",
               "h1", "h2", "|",
               "help"
           ];
       }
      // Others settings...
   });
});
</script>

Upload File

This package come with a build-in upload feature. You don't have to do anything to get it work.. expect to upload an image. 😜 If you want to do your own uploader, just register a new route and set it to imageUploadURL configuration option. (Of course you will need to create your own Controller and action, take a look here for an exemple)

Contribute

If you want to contribute to the project by adding new features or just fix a bug, feel free to do a PR.

xetaio/xetaravel-editor-md 适用场景与选型建议

xetaio/xetaravel-editor-md 是一款 基于 PHP 开发的 Composer 扩展包,目前已累计 2.87k 次下载、GitHub Stars 达 22, 最近一次更新时间为 2017 年 05 月 25 日, 在 PHP 生态内属于活跃度较高的组件。

它主要适用于以下技术方向: 「markdown」 「wysiwyg」 「laravel」 「editor.md」 「laravel-5-package」 等业务场景。在实际项目中,围绕这些方向常见需要落地的问题包括:接口对接、性能调优、并发安全、与既有框架(Laravel / ThinkPHP / Yii / Webman 等)的兼容适配,以及生产环境的日志埋点与稳定性保障。

我们在过去多个企业项目中使用过 xetaio/xetaravel-editor-md 或与其功能相近的方案,如果你在选型或落地过程中遇到问题,例如 版本兼容、二次改造、私有化封装、与内部系统对接、生产 BUG 排查,欢迎联系我们协助评估。

围绕 xetaio/xetaravel-editor-md 我们能提供哪些服务?
定制开发 / 二次开发

基于 xetaio/xetaravel-editor-md 在你已有业务上做功能扩展、字段裁剪、UI 适配、与内部账号 / 权限 / 日志系统的深度对接。

BUG 修复 & 性能优化

线上偶发问题、内存泄漏、慢查询、并发异常等排查修复;针对高流量场景做缓存、队列、索引层面的调优。

项目外包 & 长期维护

承接完整的项目从需求 → 设计 → 开发 → 上线 → 长期运维;也可按月提供技术保姆服务。

yvsm@zunyunkeji.com QQ:316430983 微信:yvsm316 西安尊云信息科技 · 专注 PHP / Go / 分布式系统研发

统计信息

  • 总下载量: 2.87k
  • 月度下载量: 0
  • 日度下载量: 0
  • 收藏数: 23
  • 点击次数: 11
  • 依赖项目数: 0
  • 推荐数: 0

GitHub 信息

  • Stars: 22
  • Watchers: 2
  • Forks: 18
  • 开发语言: PHP

其他信息

  • 授权协议: MIT
  • 更新时间: 2017-05-25