ウェブマガジン『GOKUI』は、DIYの考え方を基本にした「創造的活動の楽しさ」や「モノを大切に使い続ける奥深さ」を、自動車DIY生活、薬剤師ボランティア活動、独学ワードプレスによるブログ制作、独学アニメーション動画制作、ミニマリスト的な生活スタイルなど、様々な視点から発信しています

独学ワードプレス

ショートコードを使ってスライドショーを設置・設定する方法【ワードプレス】

今回の記事は、ショートコードを使ったスライドショーの設置と細かな設定方法を紹介しています。

  • 記事内のショートコードをコピペするだけで設置が可能です
  • 設定はショートコードを直接書き換えるだけです。難しそうに感じますが、この記事を読めば簡単に理解できるはずです

僕のウェブマガジン「GOKUI」はトップページにスライドショーを設置しています。

個人的な好みからすると動きのあるページはあまり好みではないのですが、技術的な興味があって設置してみました。

技術的に...といっても難しいことは何もなくて、ショートコードを埋め込むだけでこのような感じで動いてくれます。

milestone vehicle 情報

【2003年11月18日】Part.2 細部のチェック -アウトビアンキA112レストア日記-

~Prologue~ いらないなら,処分するぞ。 そんなひとことから,私の元へ,引き取られてきた,アウトビアンキA112 いつもの癖で,また,拾ってきしまった。 とりあえず,だめでもともと。 動けば,もうけものだ。 軽い気持ち出始めた,レストア作業。 いろんな,困難が待っているとも知らず。 ブレーキマスターシリンダー。 これはひどい。 おそらく,バッテリー液がこぼれたものをそのままに,していたのでしょう。 ブレーキパイプは,はずそうとしたときに,捩れて,モゲました。 これが,私を,悩ませることに。 とりあ ...

続きを読む

milestone vehicle 情報

【2003年10月16日】Part.1 ご対面 -アウトビアンキA112レストア日記-

~Prologue~ いらないなら,処分するぞ。 そんなひとことから,私の元へ,引き取られてきた,アウトビアンキA112 いつもの癖で,また,拾ってきしまった。 とりあえず,だめでもともと。 動けば,もうけものだ。 軽い気持ち出始めた,レストア作業。 いろんな,困難が待っているとも知らず。 こんな感じで,庭先に,寂しくぽつんとしていました。 ダッシュボードの割れもなく,中は結構きれいでした。 エンジンルームは,とにかく汚いです。 ブローバイで真っ黒だし,バッテリー液のこぼれたところは錆だらけ。 本当に,エ ...

続きを読む

独学ワードプレス

プラグインなしでFacebook(フェイスブック)を設置・設定する方法【ワードプレス】

今回の記事では、プラグインなしでワードプレスサイトへのフェイスブックヴィジェットの埋め込み方法を紹介します。 フェイスブックをサイドバー等に埋め込むことで、フェイスブックとの連携が高まるだけでなく、サイト自体が華やかにもなりますフェイスブックヴィジェットの設置はプラグインなしでも簡単に設置可能です WEBMAGAZINE「GOKUI」の運用を開始して約3か月が経過し、徐々にサイトの内容が充実してきましたので、この辺りでそろそろSNSとの連携を進めていこうと思います。 連携を考えているSNSは「Instag ...

続きを読む

自動車 DIY 生活

Peugeot・402(プジョー・402)【トヨタ博物館】

今回は愛知県長久手市のトヨタ博物館に展示されていたプジョー・402を紹介します。 愛知県長久手市のトヨタ博物館に行ってきました プジョーの歴史と実績 プジョーはフランスの自動車メーカーで、世界最古の量産自動車メーカーのひとつとして知られています。 元々は農家だったプジョー家は、「ジャン=ピエール・プジョー」により工業に転身し、その後「アルマン・プジョー」により自動車製造を手掛けることになります。 1889年には蒸気を動力とした三輪車を制作し、パリ万博博覧会で披露していました。 蒸気を動力とした自動車はすぐ ...

続きを読む

ミニマリスト的な生活

【簡単】食器洗い乾燥機(NP-TZ200-W)をDIYで取り付けてみた

今回は、先日購入した食器洗い乾燥機をDIYで取り付けてみたので紹介します。 リンク KVK製流し台用シングルレバー式混合栓 型番は【KM5041htdh】 今回取り付ける食器洗い乾燥機は、パナソニック製で型番は【NP-TZ200-W】です。一方、キッチンに備え付けられている水栓は、KVK製の【KM5041htdh】でした。 今回は、この2つを適切な「分岐止水栓」を選んでつなぐ作業になります。 分岐止水栓の取り付け難易度は、キッチンに備え付けられている水栓の種類に左右されます。 分岐止水栓を取り付ける穴がな ...

続きを読む

自動車 DIY 生活

日野「レンジャーGT」【カラフルタウン岐阜】

先日岐阜のカラフルタウンに行ったら、なんと日野「レンジャーGT」が展示してありました。 HINO(日野)の歴史と実績 日野自動車は、1942年に設立されたトラックやバスなどの商用自動車を製造する日本のメーカーです。 前身の東京瓦斯工業株式会社時代には、1917年には既に純国産トラックを試作しており、1930年に発売したバスは日本初の公営路線バスに採用されました。 また戦後の1946年には大型のトレーラートラックを完成させるなど、商用車において素晴らしい歴史を持っています。 現在は、日野ブランドとして大型・ ...

続きを読む

ミニマリスト的な生活

【レビュー】PLANTRONICS VOYAGER 3200(プラントロニクス・ボイジャー3200)

今回は先日購入したばかりのブルトゥースイヤホン「PLANTRONICS VOYAGER 3200(プラントロニクス・ボイジャー3200)」の紹介です。 プラントロニクスはアメリカの音響機器メーカーで、特にヘッドフォンでは世界的に有名ですが、ブルートゥースイヤホンでも「高性能な製品が欲しければプラントロニクスを選べば間違いなし」と認識されるほど抜けた存在だと思っています。 特に通話音質が何より優先されるビジネスマンに好んで使われていて、僕の場合も初めて手に入れたプラントロニクスのブルートゥースイヤホンが余り ...

続きを読む

milestone vehicle 情報

ゲストハウスの内装工事は石膏ボードの貼り付けがほぼ終了し、最終段階を迎えつつあります

岐阜県美濃市のMilestone Vehicleは、クルマ&バイク好き向けのDIYサポートショップです。 僕らのモットーは「何でも自分たちで作り上げること」一つ一つの作業にこだわりを持ち、自分たちで出来ることは自分たちの手で、自分たちの手に負えないことは仲間の協力を得て、日々楽しみながら作業を進めています。 クルマ&バイク好き向けのDIYサポートショップ「Milestone Vehicle」を始動します 意を決して始めたゲストハウスの内装工事ですが、約一ヶ月の時を経て最終段階に移りつつあ ...

続きを読む

ミニマリスト的な生活

【レビュー】レスキューミー(ミカド電子) 自動車用緊急脱出ツール RQM-JPY2

今回は先日購入したばかりのレスキューミー( ミカド電子 )を紹介します。 レスキューミーは自動車で事故や災害に遭遇した際に、ドアが開かなくて車内に閉じ込められたり、シートベルトが外れない時などに役立つ緊急脱出用ツールです。 キーホルダーほどの大きさにもかかわらず、軽い力で自動車のサイドガラスを割ることができ、シートベルトを切ることもできるという優れもの。 リンク 同じような機能を持つものにハンマータイプの製品もありますが、正直あまりスマートじゃないので購入に二の足を踏んでいたところ、コンパクトなこの製品を ...

続きを読む

独学ワードプレス

【2020年】ワードプレスにインスタグラム複数アカウントを設定する方法

今回の記事では、プラグイン「Smash Balloon Social Photo Feed」を使って、ワードプレスサイトに複数アカウントのインスタグラム写真を設置する方法を紹介します。 ワードプレスでは、複数アカウントのインスタグラム写真を、それぞれアカウント毎に掲載することが出来ます。今回はプラグイン「Smash Balloon Social Photo Feed」 を使った複数アカウントの設置方法を紹介します。ショートコードを直接書き換えることで、レイアウトなども自由に変更することが出来ます。 WEB ...

続きを読む

milestone vehicle 情報

ゲストハウスの内装工事がどんどん進んでいます

岐阜県美濃市のMilestone Vehicleは、クルマ&バイク好き向けのDIYサポートショップです。 僕らのモットーは「何でも自分たちで作り上げること」一つ一つの作業にこだわりを持ち、自分たちで出来ることは自分たちの手で、自分たちの手に負えないことは仲間の協力を得て、日々楽しみながら作業を進めています。 クルマ&バイク好き向けのDIYサポートショップ「Milestone Vehicle」を始動します 世間はクリスマスですが、コツコツとゲストハウスの内装工事をしています 明けましておめ ...

続きを読む

独学ワードプレス

プラグインなしでTwitter(ツイッター)を設置・設定する方法【ワードプレス】

今回の記事では、プラグインなしでワードプレスサイトへのツイッターヴィジェットの埋め込み方法を紹介します。 ツイッターをサイドバー等に埋め込むことで、ツイッターのフォロワー数を増やす機会を増やすだけでなく、サイト自体が華やかにもなりますツイッターヴィジェットの設置はプラグインなしでも簡単に設置可能です WEBMAGAZINE「GOKUI」の運用を開始して約3か月が経過し、徐々にサイトの内容が充実してきましたので、この辺りでそろそろSNSとの連携を進めていこうと思います。 連携を考えているSNSは「Insta ...

続きを読む

今回はこのようにショートコードを使ったスライドショーの設置と細かな設定方法を解説していきます。

スライドショーの設置方法

今回は固定ページにスライドショーを設置する方法で解説していきますが、投稿ページでも作業は同じです。

1)まずは下に記載してあるショートコードをそのままコピーして下さい。

[st-catgroup cat="" page="" order="" orderby="id" child="on" slide="on" slides_to_show="on" slide_date="off" slide_more="ReadMore"]

2)ワードプレスの管理画面から、固定ページ>新規作成に進みます。

3)固定ページの作成画面が表示されたので、先ほどコピーしたショートコードを貼り付けます。

4)これでスライドショーが設置されているはずなので、プレビュー画面で確認してみて下さい。

スライドショーの設定方法

次に作成したスライドショーの詳細設定をします。
設定方法はとても単純で、ショートコードをそのまま書き換えるだけの作業になります。

例えばショートコード内に【 st-catgroup cat=""  】と書かれた部分がありますが、 ここはスライドショーに表示させたいカテゴリーを設定する場所です。
【 st-catgroup cat="ここの部分"  】 にカテゴリーIDを入力することで、スライドショーに表示させたい記事をカテゴリーで絞り込むことが出来るのです。

このようにショートコードにはそれぞれ意味があり、 ""  の間に数字や文字列等を入れることで、そのショートコードの設定ができるようになっています。

一つ一つ見ていきましょう。

① 【 st-catgroup cat=""  】 の部分

上にも書きましたが、ここは表示させたいカテゴリーを絞り込むところです。
カテゴリーを絞り込まないのであれば何も入力しなくても構いませんが、カテゴリーを絞り込む場合には表示させたいカテゴリーIDを入力してください。

カテゴリーを指定しない場合は何も入力しなくても良い
【 st-catgroup cat=""  】

カテゴリーを指定する場合はIDを入力する
例えば表示させたいカテゴリーのIDが2の場合
【 st-catgroup cat="2"  】

表示させたいカテゴリーが複数の場合は【,】で区切る必要がある
例えば表示させたいカテゴリーIDが2と3と4の場合
【 st-catgroup cat="2,3,4"  】

逆に表示させたくないカテゴリーがある場合は、-(マイナス)で除外する
例えば表示させたいカテゴリーIDが7の場合
【 st-catgroup cat="-7"  】

こんな感じです。

ちなみにカテゴリーIDは、ワードプレスの管理画面から、投稿>カテゴリーと進むと確認できます。

② 【page=""】 の部分

ここはスライドショーに表示させる記事のページ数を指定するところです。

記事数を5つにする場合
【page="5"】

記事数を8つにする場合
【page="8"】

例えば【page="8"】と入力した場合、8つの記事を使ってぐるぐるとスライドショーが開始されます。

③【 order="" 】の部分

ここはスライドショーに表示させる記事の順序をDESC(降順)ASC(昇順)で指定するところです。

スライドショーの記事を新しい順に並べる場合
【 order="desc" 】

スライドショーの記事を古い順に並べる場合
【 order="asc" 】

通常は新しい順に並べると思うので 【 order="desc" 】 で良いと思います。

④ 【 orderby="" 】の部分

ここはスライドショーに表示させる記事の順序を決める際のキーとなる項目を指定するところです。

デフォルトは【id】となっていて、投稿記事のIDによって表示順序が決められますが、その他にも色々な設定ができます。

記事のIDをキーにする場合 ★デフォルト
【 orderby="id" 】

記事のタイトルをキーにする場合
【 orderby="title" 】

記事の日付・時刻をキーにする場合
【 orderby="post_date" 】

ランダムに表示させたい場合
【 orderby="rand" 】

こだわらなければデフォルトで良いと思います。

⑤ child="" の部分

ここはスライドショーに子カテゴリーの表示を指定するところです。

ワードプレスではカテゴリーに階層構造を持たせることができますが、その辺りを使いこなしている方であれば、ここの設定で表示方法をコントロールすることができます。

子カテゴリーを表示させたい場合
child="on"

子カテゴリーを表示させたくない場合
child="off"

⑥【 slide="" 】の部分

ここはスライドショーのオンオフを切り替えるところです。

スライドショー化させたい場合
【 slide="on" 】

スライドショー化させたくない場合
★ただの一覧表示になります
【 slide="off" 】

今回はスライドショー化が目的なので【 slide="on" 】でOKです。

⑦ slides_to_show="" の部分

ここはスライドショー画面の列数(一度に表示させる記事数)を指定できます。

【slides_to_show="3,3,2"】といった感じに3つの数字を並べて指定しますが、これは左から順に「PCのような大画面,タブレットのような中画面,スマホのような小画面」を意味しています。

例えは、PCのような大画面=3列、タブレットのような中画面=3列、スマホのような小画面=2列にしたい場合には
【slides_to_show="3,3,2"】

例えは、PCのような大画面=4列、タブレットのような中画面=4列、スマホのような小画面=3列にしたい場合には
【slides_to_show="4,4,3"】

といった感じに設定します。

⑧ slide_date="" の部分

ここはスライドショーに表示される記事に日付を表示させるかどうかを指定するところです。

日付を表示させたい場合
【 slide_date="on" 】

日付を表示させたくない場合
【 slide_date="off" 】

⑨ slide_more="" の部分

ここはスライドショー内に表示される「ボタンの表示名」を指定するところです。

このボタンをクリックすると記事ページに飛ぶので、「続きを読む」とか「ReadMore」とかで良いと思います。

何も表示させない場合
【 slide_date="" 】

「続きを読む」と表示させたい場合
【 slide_date="続きを読む" 】

「ReadMore」と表示させたい場合
【 slide_date=" ReadMore " 】

まとめ

今回はスライドショーの設置と設定の方法を記事にしてみました。

細かな設定で自分好みのスライドショーを作成し、ホームページに彩りを与えてみて下さい。

-独学ワードプレス

Copyright© GOKUI , 2020 All Rights Reserved.