トップページにスライダーを表示する方法

 

 

Graziosoの販売ページでは、ヘッダー部分のメインビジュアルをスライド画像で表示させていますが、これは「Meta Slider」という無料のWordPressプラグインを使用して実現しています。

 

2016年11月28日追記

弊社の開発環境にて検証した結果、WordPress4.6以降、Graziosoで「Meta Slider」を使用した場合にスライダーがフラッシュ(点滅)状態で表示されるなどの不具合が発生する可能性があることが確認されました。

したがいまして、現在「Meta Slider」を使用中で上記のような不具合が発生しているか、新規にスライダーを設置される場合は「Smart Slider 3」のご利用をご検討ください。

使い方参考(外部サイト):http://netaone.com/wp/smart-slider-3/

なお、「Smart Slider 3」を有効化すると追加される「Smart Slider」ウィジェットを使用されますとエラーが発生しますので、Black Studio TinyMCE Widgetプラグインを有効化すると追加されるビジュアルエディタウィジェットをウイジェットエリアの任意の位置に配置し、開いたエディタに「Smart Slider 3」のショートコードを貼付して保存してください。

 

※ Grazioso自体に含まれるウィジェット機能によるものではありませんのでご注意ください

 

 

無料のWordPressプラグイン「Meta Slider」

bandicam 2015-06-22 00-48-19-247

 

この「Meta Slider」に関しましては、Graziosoの推奨プラグインには含まれていないため弊社サポート対象外となりますが、WordPress公式プラグインページ上での評価は星5つ、さらにバージョンアップも頻繁に行われており、安心してご利用いただけるのではないかと思います。

詳細な使用方法については、インターネットで「Meta Slider使い方」などのワードで検索して頂ければ多くの参照サイトが見つかると思います。

参考URL: http://techacademy.jp/magazine/6885

プラグインをインストールして設定後に自動生成されるショートコードを貼り付けるだけで、投稿記事ページや固定ページにも画像スライダーを簡単に設置することができます。

なお、トップページに「Meta Slider」を使用したスライド画像を設置するには、ワードプレス管理画面のウィジェット設定画面でHome Widgetsの部分に「Meta Slider」のウィジェットを設置すればOKです。(事前にMeta Sliderでスライド画像を作成しておく必要があります)

是非、活用してください。

2015 /10 /30 追記

メタスライダーにリンクを貼ると背景に色がついてしまうという現象についてユーザー様からご報告がありました。

現在のところ根本的な原因は不明ですが、とりあえずの解決策として、下記のCSSコードをWordPress管理画面の「外観」>>「テーマオプション」>>「外観設定」タブにある「カスタムCSS」に貼付して編集されてみてください。

.widget li a, .widget li a:visited, .content-widget li a, .content-widget li a:visited {
background: #ffffff;
color: #FFFFFF;
}

上記のCSSコードを「カスタムCSS」に追加しますとメタスライダーの画像にリンクを貼った場合の背景が白になります。

他の色に変更されたい場合には background: #ffffff; のカラーコードの部分をお好みのものに変更されてください。
弊社において今後も検証作業を続行し、根本的な原因が判明しましたら、今後のバージョンアップ時にお知らせいたします。

 

この記事を書いた人

Graziosoサポート

Graziosoのカスタマー担当。