サイト育成

【サイト育成】マインドマップをブログに貼る方法

学びと投資でリッチになるブログ。今回はWordPressにマインドマップを貼る方法を学んだので、まとめてみました。

ブログにマインドマップを貼ってみたい

資格試験の勉強で、ノート代わりにマインドマップを使うことがありますが、それをこのブログに貼り付けられたらいいなと思いました。今回、以下の環境でブログにマインドマップを貼り付けることができました。

サイト作成WordPress
ブログテーマJIN(有料テーマ)
マインドマップソフトMindMeister(マインドマイスター)
※Webベースのマインドマップ作成アプリ

MindMeisterから埋め込みコードを取得する

まずMindMeister側の設定から。

1.アカウント情報の見直し

MindMeister アカウント情報

まずMindMeisterのアカウント情報を見直します。画面右上の自分のプロファイルアイコンをクリックして、自分のアカウント設定画面に入ってください。

この画面で表示される「名前」は、マインドマップをインターネットに公開したときに、情報として埋め込まれます。私は本名が入っていていたので焦りました。

2.埋め込みコードの取得

MindMeisterのブログ貼り付け


ブログに貼り付けたいマインドマップを表示します。これからこのマインドマップの「埋め込みコード」を取得します。まず画面左下の共有ボタンをクリックし、メニューを表示。「発行の設定」をクリックします。

MindMeisterのブログ貼り付け


開いたウィンドウで、最初にカテゴリや説明を入力します。次に「マップを埋め込み」のリンクをクリック。

MindMeisterのブログ貼り付け

埋め込みウィザートのウィンドウが開きます。設定欄にフレームサイズを入力するようになっていますが、よく分からなければ、まずは初期値で試してみるのがよいでしょう。私はこの初期値のままで問題ありませんでした。

下欄に「埋め込みコード」が作成されるので、これを全部選択してクリップボードにコピーします。

WordPressの記事に埋め込み

続いてMindMeisterから取得した「埋め込みコード」を、ブログ記事に貼り付けます。以下WordPressにJINというテーマを使ったブログで説明します。

MindMeisterコードの埋め込み

MindMeisterのブログ貼り付け

マインドマップを貼り付けたい記事を開きます。マインドマップを貼り付けたい場所に、「カスタムHTML」のブロックを置きます。

MindMeisterのブログ貼り付け

カスタムHTMLのブロックにMindMeisterから取得した埋め込みコードを貼り付け(ペースト)します。

MindMeisterのブログ貼り付け

カスタムHTMLのブロック内でプレビューを選択するとマインドマップが表示されて、うまくいったことが分かります。

MindMeisterの貼り付け完成

実際にMindMeisterのコードが埋め込み終わったブログを見てみましょう。

MindMeisterのブログ貼り付け

スクショのようになります。所有者はMindMeisterのアカウント情報に入力した名前が表示されるので、くれぐれも予定外の名前を出さないように。

MindMeisterのブログ貼り付け

マインドマップ名をクリックすると、別ウィンドウが開き、マインドマップを拡大してみることができます。

以上で、ブログへのマインドマップの貼り付けは完了です。

まとめ

マインドマップソフトMindMeisterで作成したマインドマップを、WordPressで作成したブログに貼り付ける方法を紹介しました。マインドマップを貼り付けることでブログの表現力が豊かなることが実感いただけたでしょうか。

私はマインドマップは一人ブレストのときなどによく利用します。MindMeisterへリンクするアイコンを下に置きましたので、よかったら覗いてみてください。思考の整理に便利ですよ。

マインドマップでブログをリッチに、資格リッチでした。それではまた!


MindMeisterの公式サイトへのリンクアイコンです。

マインドマップ

ABOUT ME
資格リッチ
都内に勤めるサラリーマン。 ”モテ資格探求家”として人生にモテる資格を求め80以上の資格を取得。 100名城登城、御朱印集め、モーターボート、グルメ、モデラー、ガジェット収集、筋トレ・ヨガなど趣味多数。 20代から資産形成にも取り組む。インデックス投資を軸として世代平均を大きく超える成果も実現。 都会(東京)と田舎(安曇野市)に二拠点を構え、ライフ・シフト後の生活スタイルを試行中。 資産形成する資格マニアの日常を綴ってます。