サイト内の画像をクリック時の動作を変える

2021/05/12

サイト内の画像をクリック時の動作を変える

今回は、サイポンサイトでの画像表示方法についてご紹介します。

まずは、画像を編集ページにて挿入します。

①セクションを追加をクリックして画像をクリックで追加
サイポンという何の指定もない画像をクリックして、左側のパネルを見ます。

画像パーツの下に

画像 クリック ALT属性 というのがあるので、

画像をクリックしてなどして、何の指定もない画像の場所へ画像を挿入します。
フリー素材から選ぶor
画像を参照よりPCフォルダより画像を選択or
サイポンと書かれている画像の場所に、
挿入したい画像を選びドラッグで移動します。

今回は、フリー素材より、パンダの着ぐるみ帽子を被った女性?
が、画像を見ている?画像を選んでみました。
ここからが、今回の本題です。
サイト内の画像クリックで画像表示を変化させる というお題ですからね。 
パンダが画像を見ている画像をクリックして、
左側の画像パーツのパネルを見て、

今度は、クリックを選びます。
クリックを押すとクリックはOKに変わり、その下に、
クリック時の動作 というものがあります。

これが新しいサイポンの画像機能です。
ようやく出来ましたね。4月頃に出来たようです。
少しご紹介が遅れました。すいません。im_ _mi

リンク 拡大 なし の3つから画像クリック時の表示が選べます。

ここ最近のサイトの流行りに追いついてきましたね。嬉しいです。
初期設定では、なし
画像をクリックしても動作は何もなし ということです。

今回は、この画像クリック時の動作を見ていきましょうというお話です。
リンクをクリックしてみましょう。
リンクをクリックすると、
URL サイト内 ファイル から選ぶことができます。

URLの下矢印のプルダウンをクリックすると、
URL 電話番号 mail と入力することが出来ます。
試しに、当ブログのURLや電話番号、メールを入力して確認して見ます。
URL 当ブログ サイポンの紹介のブログページをリンクにしてみます。
電話番号ですね。※受付専用です。
mailですね。メインブログのメールですね。
お問い合わせ等ご相談も受付しています。お気軽にご相談ください。

それぞれ、OKをクリックして確定させます。
一番確認したかった拡大ですね。やっと来ました。
拡大をクリックして、OKをします。

それぞれのリンク(URL・電話番号・mail)・拡大の表示を、
ネット上で画像リンク表示を確認します。 
一応、このページのはじめのパンダ画像は、クリック時の動作は、なしです。
確認してみましたが、拡大のみ…
拡大も何も画像クリック時の動作は、変わりませんでしたね。

少し様子を見て、確認もしていきたいと思います。
セクションでの画像追加したときでも画像拡大はしないかを下で、
確認してみましたが、画像クリック時の拡大は反映されませんでした。 画像を小さくしても、大きくしても画像クリック時の
拡大は今のところは、反映されないようですね。少し残念…
追記:ブログでは画像拡大は確認出来ませんでしたが、サイト通常ページでは、画像クリック時の拡大機能をクリックをして、確認することが出来ました。

当ブログ、ブログページにて、一時期的にパンダが画像を見ている画像を載せています。パンダが画像を見ている画像をクリックして、画像が拡大されるかを是非、確認してみてください。

サイポンサイト管理画面 ページ一覧の
各ページでは、画像拡大設定が出来ることを確認しましたので、こちらで活用してみてくださいね。
ブログ機能でも画像拡大があれば良かったですが…また、様子を見ておきましょう。
 
最後にALT属性というものも使用して見たいと思います。
ALT属性
画像の代替となるテキストを入力してみました。
パンダが画像を見ている画像 と…

こちらもネット上のページで確認してみましたが、クリックしてもパンダが画像を見ている画像 とは、出てくるところが分かりませんでした。…


↓サイポン画像拡張設定のお知らせより↓

ALT属性とは

Googleなどの検索エンジンは、見た目で画像の中身を判断することができないため、画像の中身を説明するテキストが必要です。

その検索エンジンに認識されやすくするために入れるテキストのことをALT属性といいます。

ALT属性のメリット

・画像が表示されない場合はテキストで表示されます。

・視覚障がい者の方が、スクリーンリーダーや音声ブラウザを利用した際に読み上げられます。

・SEO効果も期待できます。

ALT属性設定の注意点

画像の情報と一致しない不自然なキーワードが入っていると、迷惑行為と見なされる場合がありますのでご注意ください。 

今回は、サイト内の画像をクリック時の動作を変える
についてお話しました。

もう少し、月日が経過すると、画像にリンクも付けられて、
画像も拡大されるかもしれませんね。少し様子時間を置いてみましょう。

いつもご覧頂きありがとうございます。
少し久々に投稿しましたが、内容は、以前の画像リンクの表示についてを、
少しリニューアルして、ご紹介した という感じになりましたね。

なかなか、更新できなかったのもそういうことなのかな…

また、何か新しい機能が増えたら少しずつ紹介していきます。
いつも、ありがとうございます。
実はこの im巫mi公式ブログ
サイトCMSで作ってます。
im巫mi 
おすすめする
サイポンで、
サイト制作してみませんか?
\今なら、5ページまで無料!/
少し良いグレードでサイトを作りたい方、期間限定で、
私の紹介から、少しお得にもサイポンを使うことが出来ますので、
是非、登録フォームやご連絡にお尋ねください。