Ссылки на изображения не отображаются как html (оставлены как [img] в блоге)

Настроил keystone.js для использования cloudinary для изображений. Загрузка в редактор вроде работает, я вижу файл в редакторе и на облаке. (доказательство ниже)

http://res.cloudinary.com/keystone-demo/image/upload/v1473696039/y5v9oewncmuopq4d3vwi.jpg

Использованы стандартные настройки согласно документации на веб-странице, изменения из файла keystone.js ниже:

'wysiwyg override toolbar': false,
'wysiwyg menubar': true,
'wysiwyg skin': 'lightgray',
'wysiwyg cloudinary images': true,
'wysiwyg additional buttons': 'searchreplace visualchars,'
+ ' charmap ltr rtl pagebreak paste, forecolor backcolor,'
+' emoticons media, preview print ',
'wysiwyg additional plugins': 'example, table, advlist, anchor,'
+ ' autolink, autosave, bbcode, charmap, contextmenu, '
+ ' directionality, emoticons, fullpage, hr, media, pagebreak,'
+ ' paste, preview, print, searchreplace, textcolor,'
+ ' visualblocks, visualchars, wordcount',

Однако редактор не использует ссылку типа, а меняет ее на [img]. Это работает в окне редактора:

[img]http://res.cloudinary.com/keystone-demo/image/upload/v1473696039/y5v9oewncmuopq4d3vwi.jpg[/img]

Проблема в том, что когда вы открываете блог, вы получаете

[img]http://res.cloudinary.com/keystone-demo/image/upload/v1473696039/y5v9oewncmuopq4d3vwi.jpg[/img]

(пример можно увидеть на моей веб-странице: http://www.constructmind.com/blog/post/overview-of-the-uk-intergovernment-agreement-for-fatca-implementation)

Я проверил документацию и не могу ничего найти.

================= ОБНОВЛЕНИЕ повторно сгенерированного HTML из поста и блога =====================

почта:

<html><head><style type="text/css">@charset "UTF-8";[ng\:cloak],[ng-cloak],[data-ng-cloak],[x-ng-cloak],.ng-cloak,.x-ng-cloak,.ng-hide:not(.ng-hide-animate){display:none !important;}ng\:form{display:block;}.ng-animate-shim{visibility:hidden;}.ng-anchor{position:absolute;}</style>
        <meta charset="utf-8">
        <base href="/">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Construct Mind</title>
        <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
        <link href="/styles/site.min.css" rel="stylesheet">


        <!--Favicon-->
        <link rel="apple-touch-icon" sizes="57x57" href="/favicon/apple-icon-57x57.png">
        <link rel="apple-touch-icon" sizes="60x60" href="/favicon//apple-icon-60x60.png">
        <link rel="apple-touch-icon" sizes="72x72" href="/favicon//apple-icon-72x72.png">
        <link rel="apple-touch-icon" sizes="76x76" href="/favicon//apple-icon-76x76.png">
        <link rel="apple-touch-icon" sizes="114x114" href="/favicon//apple-icon-114x114.png">
        <link rel="apple-touch-icon" sizes="120x120" href="/favicon//apple-icon-120x120.png">
        <link rel="apple-touch-icon" sizes="144x144" href="/favicon//apple-icon-144x144.png">
        <link rel="apple-touch-icon" sizes="152x152" href="/favicon//apple-icon-152x152.png">
        <link rel="apple-touch-icon" sizes="180x180" href="/favicon//apple-icon-180x180.png">
        <link rel="icon" type="image/png" sizes="192x192" href="/favicon//android-icon-192x192.png">
        <link rel="icon" type="image/png" sizes="32x32" href="/favicon//favicon-32x32.png">
        <link rel="icon" type="image/png" sizes="96x96" href="/favicon//favicon-96x96.png">
        <link rel="icon" type="image/png" sizes="16x16" href="/favicon//favicon-16x16.png">
        <link rel="manifest" href="/favicon//manifest.json">
        <meta name="msapplication-TileColor" content="#ffffff">
        <meta name="msapplication-TileImage" content="/favicon//ms-icon-144x144.png">
        <meta name="theme-color" content="#ffffff">




        <link href="/keystone/styles/content/editor.min.css" rel="stylesheet">

        <!--[if lt IE 9]>
            <script src="//cdn.jsdelivr.net/html5shiv/3.7.3/html5shiv.js"></script>
            <script src="//cdn.jsdelivr.net/respond/1.4.2/respond.min.js"></script>
        <![endif]-->

    <script type="text/javascript" charset="utf-8" async="" src="https://platform.twitter.com/js/timeline.0e3df5929a60596ace3c16fb0b38e6f9.js"></script></head>
    <body ng-app="cmApp" class="ng-scope">
    <div id="page" style="background-image: url(&quot;/images/bg/lonsky.jpg&quot;); background-size: cover; background-position: -380px 0px;" class="fill ng-scope" ng-controller="MainCtrl as main">


        <div id="header">
            <div class="container">
                <div role="navigation" class="navbar navbar-default navbar-constructmind">
                    <div class="container-fluid">
                        <div class="navbar-header">
                            <button type="button" data-toggle="collapse" data-target=".navbar-collapse" class="navbar-toggle">
                                <span class="sr-only">Toggle navigation</span>
                                <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
                            </button>
                            <a href="/" class="navbar-brand"><img id="construct-logo" class="navbar-logo" src="/images/logo/CS-logo-title-227x100.png"></a>
                        </div>
                        <div class="collapse navbar-collapse">
                            <ul class="nav navbar-nav navbar-left">
                                        <li class="dropdown">
                                            <a class="dropdown toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Home <span class="caret"></span></a>
                                            <ul class="dropdown-menu">
                                                    <li>
                                                        <a ui-sref="home" ui-sref-active="active" href="/" class="">About us</a>
                                                    </li>
                                                    <li>
                                                        <a ui-sref="partners" ui-sref-active="active" href="/partners">Partners</a>
                                                    </li>
                                                    <li>
                                                        <a ui-sref="philosophy" ui-sref-active="active" href="/philosophy">Philosophy</a>
                                                    </li>
                                            </ul>
                                        </li>
                                        <li class="dropdown">
                                            <a class="dropdown toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Published <span class="caret"></span></a>
                                            <ul class="dropdown-menu">
                                                    <li>
                                                        <a ui-sref="blog" ui-sref-active="active" href="/blog/" class="">Articles</a>
                                                    </li>
                                                    <li>
                                                        <a ui-sref="socialmedia" ui-sref-active="active" href="/socialmedia" class="">Social Media</a>
                                                    </li>
                                            </ul>
                                        </li>
                                        <li>
                                            <a ui-sref="contact" ui-sref-active="active" href="/contact">Contact</a>
                                        </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="body" style="margin-top: 25px; height: 518px;">
            <!--
                Flash messages allow you to display once-off status messages to users, e.g. form
                validation errors, success messages, etc
            -->
            <!-- The content block should contain the body of your template's content-->
            <!-- uiView: --><ui-view class="ng-scope"><div class="container ng-scope">
    <div class="row">
        <div class="col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 wtransparent">
            <article>
                <p><a ui-sref="blog" href="/blog/">← back to the blog</a></p>
                <hr>
                <header>
                    <h1>Images test </h1>
                    <h5>


                    </h5>
                </header>
                <div class="post">
                    <img src="" class="img-responsive">
                    <br><br><br><br>
[img]http://res.cloudinary.com/keystone-demo/image/upload/v1473839295/mfi8mbb2bq20jd7sht6t.jpg[/img]
<br>
                </div>
            </article>
        </div>
    </div>
</div>
</ui-view>
        </div>
            <div id="footerwrap" class="container footer-constructmind">
                <div id="footer" style="width:100%; margin: 0px; padding-top: 10px; height: 50px;">
                    <p></p>
                    <p>
                    <span style="float: left; padding-left: 10px;">
                        <a href="http://constructmind.com" target="_blank">© Constructmind 2016</a>&nbsp;|&nbsp;
                            <a href="/keystone/signout">Sign Out</a>
                    </span>
                        <span style="float: right; padding-right: 10px; margin-top: -5px;">
                        <a href="mailto:[email protected]" style="border-width:0px; border:0px; text-decoration: none;"><img width="25" height="25" style="border: none; width: 25px; max-width: 25px !important; height: 25px; max-height: 25px !important;" src="/images/logos/png/40px/website.png"></a>&nbsp;<a href="https://www.linkedin.com/in/BengtBjorkberg" style="border-width:0px; border:0px; text-decoration: none;"><img width="25" height="25" style="border: none; width: 25px; max-width: 25px !important; height: 25px; max-height: 25px !important;" src="/images/logos/png/40px/linkedin.png"></a>&nbsp;<a href="https://plus.google.com/108193570873442725868" style="border-width:0px; border:0px; text-decoration: none;"><img width="25" height="25" style="border: none; width: 25px; max-width: 25px !important; height: 25px; max-height: 25px !important;" src="/images/logos/png/40px/googleplus.png"></a>&nbsp;<a href="skype:vrghost-242?call" style="border-width:0px; border:0px; text-decoration: none;"><img width="25" height="25" style="border: none; width: 25px; max-width: 25px !important; height: 25px; max-height: 25px !important;" src="/images/logos/png/35px/skype.png"></a>
                    </span>
                    </p>
                </div>
            </div>



    </div>



    <!-- END Javascript -->

    <!--START Google Analytics-->

    <!--END Google Analytics-->

    <script async="" src="https://www.google-analytics.com/analytics.js"></script><script src="/js/jquery/jquery-2.1.4.min.js"></script>
    <script src="/js/bootstrap/bootstrap-3.3.5.min.js"></script>
    <script src="/keystone/js/content/editor.js"></script>
    <script src="/bower_components/angular/angular.min.js"></script>
    <script src="/bower_components/angular-sanitize/angular-sanitize.min.js"></script>
    <script src="/bower_components/angular-ui-router/release/angular-ui-router.min.js"></script>
    <script src="/bower_components/angular-animate/angular-animate.min.js"></script>
    <script src="/bower_components/angular-resource/angular-resource.min.js"></script>
    <script>
        (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
        })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

        ga('create', 'UA-61636453-1', 'auto');
        ga('send', 'pageview');

    </script>

    <script src="/javascripts/constructmind.js"></script>

<iframe id="rufous-sandbox" scrolling="no" frameborder="0" allowtransparency="true" allowfullscreen="true" style="position: absolute; visibility: hidden; display: none; width: 0px; height: 0px; padding: 0px; border: none;"></iframe></body></html>

блог:

<html><head><style type="text/css">@charset "UTF-8";[ng\:cloak],[ng-cloak],[data-ng-cloak],[x-ng-cloak],.ng-cloak,.x-ng-cloak,.ng-hide:not(.ng-hide-animate){display:none !important;}ng\:form{display:block;}.ng-animate-shim{visibility:hidden;}.ng-anchor{position:absolute;}</style>
        <meta charset="utf-8">
        <base href="/">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Construct Mind</title>
        <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
        <link href="/styles/site.min.css" rel="stylesheet">


        <!--Favicon-->
        <link rel="apple-touch-icon" sizes="57x57" href="/favicon/apple-icon-57x57.png">
        <link rel="apple-touch-icon" sizes="60x60" href="/favicon//apple-icon-60x60.png">
        <link rel="apple-touch-icon" sizes="72x72" href="/favicon//apple-icon-72x72.png">
        <link rel="apple-touch-icon" sizes="76x76" href="/favicon//apple-icon-76x76.png">
        <link rel="apple-touch-icon" sizes="114x114" href="/favicon//apple-icon-114x114.png">
        <link rel="apple-touch-icon" sizes="120x120" href="/favicon//apple-icon-120x120.png">
        <link rel="apple-touch-icon" sizes="144x144" href="/favicon//apple-icon-144x144.png">
        <link rel="apple-touch-icon" sizes="152x152" href="/favicon//apple-icon-152x152.png">
        <link rel="apple-touch-icon" sizes="180x180" href="/favicon//apple-icon-180x180.png">
        <link rel="icon" type="image/png" sizes="192x192" href="/favicon//android-icon-192x192.png">
        <link rel="icon" type="image/png" sizes="32x32" href="/favicon//favicon-32x32.png">
        <link rel="icon" type="image/png" sizes="96x96" href="/favicon//favicon-96x96.png">
        <link rel="icon" type="image/png" sizes="16x16" href="/favicon//favicon-16x16.png">
        <link rel="manifest" href="/favicon//manifest.json">
        <meta name="msapplication-TileColor" content="#ffffff">
        <meta name="msapplication-TileImage" content="/favicon//ms-icon-144x144.png">
        <meta name="theme-color" content="#ffffff">




        <link href="/keystone/styles/content/editor.min.css" rel="stylesheet">

        <!--[if lt IE 9]>
            <script src="//cdn.jsdelivr.net/html5shiv/3.7.3/html5shiv.js"></script>
            <script src="//cdn.jsdelivr.net/respond/1.4.2/respond.min.js"></script>
        <![endif]-->

    <script type="text/javascript" charset="utf-8" async="" src="https://platform.twitter.com/js/timeline.0e3df5929a60596ace3c16fb0b38e6f9.js"></script></head>
    <body ng-app="cmApp" class="ng-scope">
    <div id="page" style="background-image: url(&quot;/images/bg/lonsky.jpg&quot;); background-size: cover; background-position: -285px 0px;" class="fill ng-scope" ng-controller="MainCtrl as main">


        <div id="header">
            <div class="container">
                <div role="navigation" class="navbar navbar-default navbar-constructmind">
                    <div class="container-fluid">
                        <div class="navbar-header">
                            <button type="button" data-toggle="collapse" data-target=".navbar-collapse" class="navbar-toggle">
                                <span class="sr-only">Toggle navigation</span>
                                <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
                            </button>
                            <a href="/" class="navbar-brand"><img id="construct-logo" class="navbar-logo" src="/images/logo/CS-logo-title-227x100.png"></a>
                        </div>
                        <div class="collapse navbar-collapse">
                            <ul class="nav navbar-nav navbar-left">
                                        <li class="dropdown">
                                            <a class="dropdown toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Home <span class="caret"></span></a>
                                            <ul class="dropdown-menu">
                                                    <li>
                                                        <a ui-sref="home" ui-sref-active="active" href="/" class="">About us</a>
                                                    </li>
                                                    <li>
                                                        <a ui-sref="partners" ui-sref-active="active" href="/partners">Partners</a>
                                                    </li>
                                                    <li>
                                                        <a ui-sref="philosophy" ui-sref-active="active" href="/philosophy">Philosophy</a>
                                                    </li>
                                            </ul>
                                        </li>
                                        <li class="dropdown">
                                            <a class="dropdown toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Published <span class="caret"></span></a>
                                            <ul class="dropdown-menu">
                                                    <li>
                                                        <a ui-sref="blog" ui-sref-active="active" href="/blog/" class="active">Articles</a>
                                                    </li>
                                                    <li>
                                                        <a ui-sref="socialmedia" ui-sref-active="active" href="/socialmedia" class="">Social Media</a>
                                                    </li>
                                            </ul>
                                        </li>
                                        <li>
                                            <a ui-sref="contact" ui-sref-active="active" href="/contact">Contact</a>
                                        </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="body" style="margin-top: 25px; height: 518px;">
            <!--
                Flash messages allow you to display once-off status messages to users, e.g. form
                validation errors, success messages, etc
            -->
            <!-- The content block should contain the body of your template's content-->
            <!-- uiView: --><ui-view class="ng-scope"><div class="container ng-scope">
    <h1>Blog</h1>
</div>
<div class="container ng-scope">
    <div class="row">
        <div class="col-sm-8 col-md-9 ctransparent">
            <h4 class="text-weight-normal">Showing 2 post.</h4>
            <div class="blog">
                <div data-ks-editable="" class="post wtransparent">
                    <h2><a ui-sref="post({articletitle: 'implementing-fatca-all-over' })" href="/blog/post/implementing-fatca-all-over">Implementing FATCA all over</a></h2>
                    <p class="lead text-muted">Posted in <a href="/blog/regulatory">Regulatory</a>
                            by Bengt
                    </p>
                    <img src="" class="img pull-right">
                    <p></p><p><span style="color: #333333; font-family: Arial, sans-serif; text-align: justify;">DBFS was engaged by one of the worlds leading global brokers to consult on the implementation of FATCA for more than 200 entities in over 30 jurisdictions. In this paper we share some of the lessons learnt from undertaking an implementation of this size and, whilst this project was specific to FATCA, we believe that the same issues and solutions will be relevant when implementing OECD Common Reporting Standard and DAC over the next year.</span></p><p></p>
                    <p class="read-more"><a ui-sref="post({articletitle: 'implementing-fatca-all-over' })" href="/blog/post/implementing-fatca-all-over">Read more...</a></p>
                </div>
                <div data-ks-editable="" class="post wtransparent">
                    <h2><a ui-sref="post({articletitle: 'images-test' })" href="/blog/post/images-test">Images test </a></h2>
                    <p class="lead text-muted">
                            by Bengt
                    </p>
                    <img src="" class="img pull-right">
                    <p><br><br><br><br>
Testing imaegs
<br></p>
                    <p class="read-more"><a ui-sref="post({articletitle: 'images-test' })" href="/blog/post/images-test">Read more...</a></p>
                </div>
            </div>
        </div>
        <div class="col-sm-4 col-md-3">
            <h2>Categories</h2>
            <div style="margin-top: 70px;" class="list-group">
                <a href="/blog" class="active list-group-item">All Categories</a>
                <a ui-sref="blog({category: 'Regulatory' })" class="false list-group-item" href="/blog/Regulatory">Regulatory</a>
            </div>
        </div>
    </div>
    <ul class="pagination">
        <li class="disabled">
            <a ui-sref="blog({page 'false' })">
                <span class="glyphicon glyphicon-chevron-left"></span>
            </a>
        </li>
        <li class="active"><a href="/blog?page=1">1</a></li>

        <li class="disabled">
            <a ui-sref="blog({page 'false' })">
                <span class="glyphicon glyphicon-chevron-right"></span>
            </a>
        </li>
    </ul>
</div>
</ui-view>
        </div>
            <div id="footerwrap" class="container footer-constructmind">
                <div id="footer" style="width:100%; margin: 0px; padding-top: 10px; height: 50px;">
                    <p></p>
                    <p>
                    <span style="float: left; padding-left: 10px;">
                        <a href="http://constructmind.com" target="_blank">© Constructmind 2016</a>&nbsp;|&nbsp;
                            <a href="/keystone/signout">Sign Out</a>
                    </span>
                        <span style="float: right; padding-right: 10px; margin-top: -5px;">
                        <a href="mailto:[email protected]" style="border-width:0px; border:0px; text-decoration: none;"><img width="25" height="25" style="border: none; width: 25px; max-width: 25px !important; height: 25px; max-height: 25px !important;" src="/images/logos/png/40px/website.png"></a>&nbsp;<a href="https://www.linkedin.com/in/BengtBjorkberg" style="border-width:0px; border:0px; text-decoration: none;"><img width="25" height="25" style="border: none; width: 25px; max-width: 25px !important; height: 25px; max-height: 25px !important;" src="/images/logos/png/40px/linkedin.png"></a>&nbsp;<a href="https://plus.google.com/108193570873442725868" style="border-width:0px; border:0px; text-decoration: none;"><img width="25" height="25" style="border: none; width: 25px; max-width: 25px !important; height: 25px; max-height: 25px !important;" src="/images/logos/png/40px/googleplus.png"></a>&nbsp;<a href="skype:vrghost-242?call" style="border-width:0px; border:0px; text-decoration: none;"><img width="25" height="25" style="border: none; width: 25px; max-width: 25px !important; height: 25px; max-height: 25px !important;" src="/images/logos/png/35px/skype.png"></a>
                    </span>
                    </p>
                </div>
            </div>



    </div>



    <!-- END Javascript -->

    <!--START Google Analytics-->

    <!--END Google Analytics-->

    <script async="" src="https://www.google-analytics.com/analytics.js"></script><script src="/js/jquery/jquery-2.1.4.min.js"></script>
    <script src="/js/bootstrap/bootstrap-3.3.5.min.js"></script>
    <script src="/keystone/js/content/editor.js"></script>
    <script src="/bower_components/angular/angular.min.js"></script>
    <script src="/bower_components/angular-sanitize/angular-sanitize.min.js"></script>
    <script src="/bower_components/angular-ui-router/release/angular-ui-router.min.js"></script>
    <script src="/bower_components/angular-animate/angular-animate.min.js"></script>
    <script src="/bower_components/angular-resource/angular-resource.min.js"></script>
    <script>
        (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
        })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

        ga('create', 'UA-61636453-1', 'auto');
        ga('send', 'pageview');

    </script>

    <script src="/javascripts/constructmind.js"></script>

<iframe id="rufous-sandbox" scrolling="no" frameborder="0" allowtransparency="true" allowfullscreen="true" style="position: absolute; visibility: hidden; display: none; width: 0px; height: 0px; padding: 0px; border: none;"></iframe></body></html>

keystonejs
person vrghost    schedule 12.09.2016    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Приходится отключать плагин bbcode, он отвечает за конвертацию в [img].

person w00t    schedule 13.09.2016
comment
На самом деле это не было моим намерением ... Хорошо, если говорить более серьезно, я думаю, что плагин bbcode работает в редакторе (через вход в интерфейс трапецеидального искажения), однако я не могу найти никакого способа сказать ./blog или /блог/пост интерфейс. Я вижу, что сообщение хочет загрузить редактор, если я вошел в систему как редактор, но не уверен, какая часть трапецеидального искажения отображает сообщения. Я добавил обработанный HTML для публикации для ясности. Это с того момента, когда я вошел в систему. Но вошел в систему или нет, похоже, это не проходит через bbcode? - person vrghost; 14.09.2016
comment
@vrghost Я не понимаю, что ты имеешь в виду. В разделе плагинов wysiwyg у вас есть bbcode в качестве плагина, и он преобразует URL-адреса в [img], пока вы редактируете сообщение. Все, что происходит после этого, просто предполагает, что сообщение является допустимым html. - person w00t; 14.09.2016
comment
Хорошо, я идиот, я думал, ты имеешь в виду, что я отключил его, мой плохой. Кстати, этот блок настроек был скопирован из раздела настроек для wysisyg на keystone.js. Может стоит удалить? - person vrghost; 14.09.2016
comment
Так что, если это правильный ответ, хорошо, если вы отметите его как таковой: P - person w00t; 15.09.2016