FCKeditor + IMCE + Lightbox2で写真を簡単に公開する方法

Drupalは非常に柔軟であるため、私は気に入っています。 問題はいくつかの方法で解決できます。

私の仕事は、テキスト内の写真を簡単にダウンロードして公開できるようにすることでした。
私はインタラクティブなギャラリーを作成するつもりはないという事実に注目します。 ユーザーが便利なビジュアルエディターを使用して写真をアップロードし、同じように便利に公開できるようにするだけです。

FCKeditorをエディターとして、イメージダウンローダーおよびIMCEファイルブラウザーとして選択しました。

ここで問題自体について。


画像をサーバーにアップロードし、サムネイルを作成し、このサムネイルを投稿に挿入したいとします。 サムネイルをクリックすると、Lightbox2モジュールを使用して、サムネイルが元のサイズで画像を開くはずです。

手動で行うのは不便で長いです。
drupal.ruのページで解決策を見つけました。 解決策は、FCKeditorを編集することでした。 そのため、更新するたびに、これらすべてのファイルを再編集する必要があります。
それで、私は自分の自転車を書くことにしました。 しかし、私のサイトに適しています。

解決策



私はプラグインを書くことで最も猛烈な恋人です-私はpage.tpl.phpを通してすべてをpage.tpl.phpか、 index.php私の関数を直接含めるのが好きです。

では、ページのhtmlコードを見て、現時点で何があるかを見てみましょう。
< img alt ="" height ="90" src ="/sites/default/files/img/2-27SP_vorn_small.jpg" width ="90" />

* This source code was highlighted with Source Code Highlighter .


このコードを次のように変換する必要があります。
< a href ="/sites/default/files/img/2-27SP_vorn.jpg" >< img src ="/sites/default/files/img/2-27SP_vorn_small.jpg" alt ="" ></ a >

* This source code was highlighted with Source Code Highlighter .


page.tpl.phpを開きましょう(これがテーマファイルです)。
そして、コードの最初の行を書きます。
if (strstr($content, 'src=' )){
}

* This source code was highlighted with Source Code Highlighter .


この行は、ページに画像要素があるかどうかを示します。
次に、画像を元の画像リンクに変更するスクリプトを作成します。
$content = preg_replace( '#<img width=\"[0-9a-zA-Z ]*\" height=\"[0-9a-zA-Z ]*\" src=\"([a-zA-Z0-9\/_-]+)*(_small+)\.(jpg|gif|png+)\"([ a-zA-Z="-_.]+)*\/\>#' , "<a href=\"$1.$3\"><img src=\"$1$2.$3\" $4></a>" ,$content);

* This source code was highlighted with Source Code Highlighter .


+ビジュアルエディターのページではこれらの変更を行わないようにしましょう。 これを行うには、次の条件を作成します。
if (!strstr($_SERVER[ 'REQUEST_URI' ], 'edit' ))

* This source code was highlighted with Source Code Highlighter .


その結果、次のスクリプトが得られました。


if (!strstr($_SERVER[ 'REQUEST_URI' ], 'edit' ))
{
if (strstr($content, "src=" ))
{
$content = preg_replace( '#<img width=\"[0-9a-zA-Z ]*\" height=\"[0-9a-zA-Z ]*\" src=\"([a-zA-Z0-9\/_-]+)*(_small+)\.(jpg|gif|png+)\"([ a-zA-Z="-_.]+)*\/\>#' , "<a href=\"$1.$3
\"><img src=\"$1$2.$3\" $4></a>"
,$content);
}
}


* This source code was highlighted with Source Code Highlighter .


これで、このコードをpage.tpl.phpファイルの最初に安全に挿入できます。

私たちは何をしましたか?


これで、すべてのユーザーが画像をアップロードするだけで、接尾辞_smallを使用してサムネイルを作成し(ロード時にアイテムを選択すると作成されます)、このサムネイルをノードに追加します。

+ lightbox2のサポートを追加


管理パネルに移動してから、ライトボックスページに移動します。
[ Automatic image handling ]タブを見つけます。
アイテムCustom Class Images移動します。
Lightbox、または、たとえば、Lightbox Gropedを選択し、画像クラスの名前を指定します。
デフォルトではlb2です。 これを残すことをお勧めします。

写真にこのクラスが含まれるようにスクリプトを変更します。
if (!strstr($_SERVER[ 'REQUEST_URI' ], 'edit' ))
{
if (strstr($content, "src=" ))
{
$content = preg_replace( '#<img width=\"[0-9a-zA-Z ]*\" height=\"[0-9a-zA-Z ]*\" src=\"([a-zA-Z0-9\/_-]+)*(_small+)\.(jpg|gif|png+)\"([ a-zA-Z="-_.]+)*\/\>#' , "<a href=\"$1.$3
\"><img class=\"lb2\" src=\"$1$2.$3\" $4></a>"
,$content);
}
}


* This source code was highlighted with Source Code Highlighter .


すべて準備完了です!

完全なスクリプトをダウンロード [0.5 kb]

スクリプトの結果 (テストサイト)

Source: https://habr.com/ru/post/J77263/


All Articles