ページに動きを出し、サイト用のアイコンで注目度をUP
![チキ](https://great-job.info/wp-content/uploads/2019/08/眼帯ポテチン.jpg)
最近この手の記事書くの好きになってきたわ~
今回はWordpressの最強無料テーマ Cocoon(コクーン)のカルーセル機能を使って、一瞬でサイトに動きを出します。
本当に無料のテーマでいいのかというくらい見栄えがUPしますが、無料なのがCocoonのすごいところ。
しかも設定は超簡単です。一瞬です。
そして、サイトのURLやブックマークのアイコンを作成し、公式サイト感を演出します。
![キューピー](https://great-job.info/wp-content/uploads/2019/12/-e1575680336138.jpg)
このアイコンのことを、favicon(ファビコン)とかいうらしいよ・・
![のぞき見チキ](https://great-job.info/wp-content/uploads/2019/09/o0800060011572012334.jpg)
チキが知る由もない・・・(笑)
![キューピー](https://great-job.info/wp-content/uploads/2019/12/-e1575680336138.jpg)
今回の記事はシンプルですよ~
まずは今回のゴールを見てみましょう
カスタマイズ前の本サイト『転職で幸せな天職を』はこのような形です。
Before
![](https://great-job.info/wp-content/uploads/2020/03/メニューのみ追加後トップページ-1024x424.png)
After
![](https://great-job.info/wp-content/uploads/2020/03/カルーセル適用トップページ編集後-1024x423.png)
![にっこりチキ](https://great-job.info/wp-content/uploads/2019/09/o0800120011996147420.jpg)
どうですか?すごくないですか?(←興奮)
そして、アドレスバー付近のサイトアイコンも(今回はタブの部分しかお見せできませんが)
![](https://great-job.info/wp-content/uploads/2020/03/アドレスバー-1024x222.png)
faviconの設定はWordpressの標準機能を使って速攻で実装が可能です。
それでは、一つずつ見ていきましょう。
Cocoonを利用したカルーセルの設定方法
WordPressダッシュボードより、以下の画面を開いてください。
![](https://great-job.info/wp-content/uploads/2020/03/Cocoon設定画面.png)
![](https://great-job.info/wp-content/uploads/2020/03/Cocoon設定からのカルーセル-1024x171.png)
カルーセル機能をオンにするには、【カルーセルの表示】を変更します。当ブログではトップページのみ表示するようにしています。
その他は【オートプレイインターバル】を3秒間に設定しています。
そして、【変更をまとめて保存】ボタンをクリックすれば設定完了です。
![キューピー](https://great-job.info/wp-content/uploads/2019/12/-e1575680336138.jpg)
む、、、、むっちゃ簡単や・・・
次にサイトアイコン(favicon:ファビコン)を設定しましょう
サイトのアイコンは、設置する方法はいくつかあるようなのですが、最も簡単な方法で設置していきます。
WordPressの標準機能を利用する方法です。
まずは、以下の画面を開いてください。
![](https://great-job.info/wp-content/uploads/2020/03/外観→カスタマイズ.png)
![](https://great-job.info/wp-content/uploads/2020/03/サイトの基本情報.png)
フリーの画像は、Googleで『512×512 png free』 などと検索すれば無料のサイトがたくさん出てきますので適宜ダウンロードしてみて下さい。
![キューピー](https://great-job.info/wp-content/uploads/2019/12/-e1575680336138.jpg)
自作の画像をアップロードしたい場合はどうしたらいいの?
![にっこりチキ](https://great-job.info/wp-content/uploads/2019/09/o0800120011996147420.jpg)
もちろん、いい方法があるよ!
自作で作成した画像はサイトでファビコン用の画像に変換してくれます。
![](https://ao-system.net/favicongenerator/common/image/ogp.webp)
自作の画像をサイトにアップロードすればファビコン用アイコンに自動変換してくれる素晴らしいツールです。
小さなカスタマイズの積み重ねが上質なサイトをつくる
いかがでしたでしょうか?
今回の記事の内容は非常に簡単でしかも確実のあなたのサイトをワンランク上質なものにしてくれる方法です。
WordPress&Cocoonの組み合わせで実装できるサイトのカスタマイズについて、このような記事も作成しています。
いずれもブログトップページをオシャレでクリックしたくなるデザインにすることができます。
![](https://great-job.info/wp-content/uploads/2020/01/Wordpress自転車-160x90.png)
WordpressとCocoonの組み合わせでブログ運営されているかたでポータルサイト型のブログを構築したいと思いませんか?本記事では、HTML,CSSの記述無しであなたのブログを1日でサイト型ブログにカスタマイズする驚きの方法をお伝えします。
![](https://great-job.info/wp-content/uploads/2020/02/Wordpress②-ヘッダーメニュー-160x90.png)
当サイトもまだまだこれからブラッシュアップしていきます。
ブロガーの皆さん、一緒に良いサイトを作り上げていきましょう!
![チキ](https://great-job.info/wp-content/uploads/2019/08/眼帯ポテチン.jpg)
今日はここまで~!
コメント