TentenのBlogに来て下さり、ありがとうございます!こちらのBlogでは、主に副業での収入アップ術や実体験に基づく投資の実績、フリーランスの生き方などについて発信しております^ ^

THE THOR(ザ・トール)でサイトカード・ブログカードの使い方〜カスタマイズもしてみました〜

こんにちは、テンテンです。

 

今回は、THE THOR(ザ・トール)でサイトカードとブログカードの使い方とについて解説します。

 

 Tenten

デフォルトのデザインだと状態だと少し地味ということもあり、若干カスタマイズもしてみました。

コピペで使えるように最後には、プログラミングコードを添付しておきます。

 

 

また、色を変更したい方もいるかと思いますので、どのコードをいじって色変更をしたら良いかについても解説します。

 

THE THORでサイトカード・ブログカードの使い方を知ろう!

 

THE THOR(ザ・トール)では、デフォルトの機能でサイトカードとブログカードを使うことができます。

 

 

サイトカードは、内部リンクを貼り付ける時に使うモノで、ブログカードは外部リンクを貼り付ける時に使うモノという形で認識しておきましょう。

 

一般的に、これらはまとめてブログカードと呼ばれますが、THE THOR(ザ・トール)では、使い分けがハッキリわかるようにこのようにしているのかと思います。

 

では、早速使い方について解説していきます。

 

①「ショートコード」→「ブログカードorサイトカード」を選択します。

 

 

 

次に、〜URL=URL入力します。

 

 

この際、シングルコーテーションやダブルコーテーションは入力しなくても、適切に表示されます。ちなみにシングルコーテーションやダブルコーテーションがあっても表示されるようです。

 

「関連記事」という文言を変更したい場合は、一度削除して新しく入力しましょう。

 

 

使い方自体の説明はこれで全てとなります。

 

 

ブログカード・サイトカードをカスタマイズしてみた

 

デフォルトのデザインでも十分に使えるのですが、当ブログでは赤をメインにしているので、以前プラグミングスクールに行ってたこともあり、若干ですがカスタマイズしてみました。

 

【実際のカスタマイズ】

関連記事

プログラミングスクール界のTECH::EXPERT(テックエキスパート)の評判って実際どうなの...?   どんな企業に転職できるの? 具体的なカリキュラムの内容は? フリーランスコースを受講したら[…]

 

ちなみにこちらの記事はプラグラミングスクール(テックエキスパート )に通っていた時の記事なので、興味がある方はご覧ください。

 

一応、コピペでも使えるようにプログラミングコードをのせておきます。

 

【サイトカード・ブログカードのカスタマイズコード】

 

ではこちらのプラグラミングコードを「追加CSS」に貼り付けていきましょう!

 

通常、スタイルシートを書き換えていくのですが、デザインが崩れてしまい取り返しがつかなくなってしまうこともあるので「追加CSS」にこちらのコードを貼り付ける方法をオススメします。

 

すでにやり方がわかる方は、ここは読み飛ばしていただいて問題ありません。

 

では「追加CSS」に貼り付ける方法について解説します。

 

①「外観」→「カスタマイズ」に進みます。

 

②「追加CSS」に進みます。

 

③CSSのプログラミングコードを貼り付けます。

 

最後に「公開」して完了です。今回は、サイトガード・ブログカードのCSSをカスタマイズをしてますが、基本的にCSSでカスタマイズする際は、「追加CSS」を活用していきましょう。

 

色など若干デザインを変更したい方のために

 

色など若干デザインを変更したい方もいるでしょう。そんな方の為に、コードをいじる場所をお伝えさせていただきます。

 

まず、こちらのプログラミングコードは23行で構成しています。

 

1行目〜11行目が、「サイトカード(内部記事リンク)」のプログラミングコードで、13行目〜23行目が「ブログカード(外部サイトリンク)」のプログミングコードにしています。

 

例えば、「サイトカード」の色を変更していきたい場合、下記画像の数字の箇所【#〜;】部分を書き換えていきます。

 

CSSのカラーコードは、原色大辞典をご参考にください。あくまもで、参考なので他のサイトからでも問題ありません。

 

 

 

上記の画像でどのプラグミングコードを書き換えたら、どこが変更されるのか数字で表していますので、ご参考にください。

 

ちなみにブログカードも同じ容量で変更することができます。一旦、サイトカードとブログカードは、同じカスタマイズにしています。

 

カスタマイズが完了したら、忘れずに「公開」をしてくださいね。

 

さいごに

 

今回は、THE THOR(ザ・トール)でサイトカードとブログカードの使い方とカスタマイズについて解説させていただきました。

 

特に、「サイトカード」の機能は頻繁に使うので、必ず使い方は覚えておきましょう!

 

デフォルトのデザインでも十分に使えるので、カスタマイズに関しては余裕がある方だけで問題ないです。まずは記事を定期的に更新していくことが最も重要です。

 

お互いに頑張っていきましょう!

 

最後まで読んでいただきありがとうございました。

最新情報をチェックしよう!
>Tenten Blog

Tenten Blog