2016-09-12 34 views
0

已經設置了keystone.js來爲圖像使用cloudinary。在編輯器上的上傳似乎有效,我可以在編輯器和cloudinary中看到該文件。 (以下證明)圖像鏈接不呈現爲html(在博客上保留爲[img])

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-intergovernmental-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> 

回答

1

你必須關閉bbcode插件,它負責轉換爲[img]

+0

這真的不是我的意圖......好吧,更嚴肅的說法是,我認爲bbcode插件在編輯器中工作(通過登錄的keystone接口),但是我找不到任何tellind的方式。/blog或/ blog/post界面。如果我以編輯器身份登錄,但可以看到該帖子希望加載編輯器,但不確定keystone「呈現」帖子的哪一部分。爲了清晰起見,我添加了用於發佈的呈現HTML。它來自我登錄的時間。但是登錄或不登錄,它似乎不通過bbcode? – vrghost

+0

@vrghost我不明白你的意思。在wysiwyg插件部分,您將'bbcode'作爲插件,並在您編輯帖子時將urls轉換爲'[img]'。之後發生的任何事情只是假定帖子是有效的html。 – w00t

+0

好吧,我是個白癡,我以爲你的意思是我把它變成了壞人。順便說一下,該設置塊已經在keystone.js上的wysisyg的設置部分中複製。可能值得刪除它? – vrghost