Warning: Constant POST_PLUGIN_LIBRARY already defined in /home/pasora/pasona-sp.com/public_html/wp-content/plugins/similar-posts/similar-posts.php on line 27
PDFをブログに添付MimeTypes Link Iconsでアイコンも | 思いだし にっき
サイトアイコン 思いだし にっき

PDFをブログに添付MimeTypes Link Iconsでアイコンもつける

<p><img class&equals;"aligncenter size-full wp-image-10650" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;9393140263fafcec48ec4603b6c7a4b6&lowbar;s&period;jpg" alt&equals;"" width&equals;"384" height&equals;"271" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>ブログを書いていると、これは画像で貼り付けると小さすぎてみにくいとか、<br &sol;>&NewLine;もっと印刷してもみやすいものを入れたい、なんていうことが出てきます。<&sol;p>&NewLine;<p>そこで利用するのがPDFの添付。<&sol;p>&NewLine;<p>WordやExcelのデータをPDFにしてダウンロードできるようになんて考えます。<&sol;p>&NewLine;<p>そこで、どうやればいいのか・・・となるのですね。<&sol;p>&NewLine;<p>PDFの添付のやり方がわかったら、そのファイルがひと目でPDFだとわかるマークにしたいですね(^^)。<&sol;p>&NewLine;<p>それらの方法を備忘録的にまとめてみました。<&sol;p>&NewLine;<p><&excl;--more--><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<h2>PDFの添付方法<&sol;h2>&NewLine;<p>PDFのリンクをブログに貼り付けます。<&sol;p>&NewLine;<p>※WORDやExcelのファイルをPDFにするには、名前をつけて保存で<strong>ファイルの種類を「PDF」にして保存<&sol;strong>します。<&sol;p>&NewLine;<p><strong>PDFの貼り付けもブログに画像を追加する方法と同じ<&sol;strong>です。<&sol;p>&NewLine;<p>投稿画面から「メディアを追加」をクリックします。<&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7125" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;pd01&period;png" alt&equals;"" width&equals;"502" height&equals;"306" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>作成したPDFファイルを「メディアを追加」にドラッグします。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7126" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;pd02&period;png" alt&equals;"" width&equals;"500" height&equals;"334" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>画像の追加と同じようにPDFを選んで「投稿」をクリックします。<&sol;p>&NewLine;<p>図のようになります。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7148" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;pd3&period;png" alt&equals;"" width&equals;"500" height&equals;"385" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>投稿のビジュアルモードでみると図のように表示されます。<br &sol;>&NewLine;          ↓   ↓   ↓<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7128" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;pd4&period;png" alt&equals;"" width&equals;"254" height&equals;"133" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>これでOKです。<&sol;p>&NewLine;<p>ブログを訪れた人がクリックすればダウンロードできます。<&sol;p>&NewLine;<p>ただし、これでは記事を読んでいる途中でPDFファイルをクリックするとPDFに移動してしまいます。<&sol;p>&NewLine;<p>記事画面に戻るにはブラウザの戻るをクリックしなければなりません。<&sol;p>&NewLine;<p>その手間を省くためには新規ウィンドウで開いて欲しいですよね。<&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<h2>PDFを別ウィンドウで開くようにする<&sol;h2>&NewLine;<p><strong><span style&equals;"font-size&colon; 18pt&semi;">・ビジュアルモードで貼り付けた後に編集する場合<&sol;span><&sol;strong><&sol;p>&NewLine;<p>貼り付けたPDFの上でクリックすると編集ボタンが表示されます。<&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7129" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD15&period;png" alt&equals;"" width&equals;"505" height&equals;"139" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>編集をクリックすると青く反転して右に設定ボタン(歯車アイコン)が表示されるのでクリックします。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7130" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD10&period;png" alt&equals;"" width&equals;"500" height&equals;"133" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p><strong>リンクの挿入&sol;編集画面<&sol;strong>が開きます。<&sol;p>&NewLine;<p>そこでURLの下の「<strong>リンクを新しいタブで開く<&sol;strong>」にチェックを入れます。<&sol;p>&NewLine;<p>「更新」ボタンをクリックします。<&sol;p>&NewLine;<p>これでURLが別ウィンドウで開いてくれます。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7131" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD11&period;png" alt&equals;"" width&equals;"502" height&equals;"175" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p><strong><span style&equals;"font-size&colon; 18pt&semi;">・初めから別ウインドウで開くように貼り付ける場合<&sol;span><&sol;strong><&sol;p>&NewLine;<p>(例:テキストモード どちらのモードでも同じ)<&sol;p>&NewLine;<p>ダッシュボードの左側のメニューから「メディア」&Implies;「新規追加」をクリックします。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7132" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD05&period;png" alt&equals;"" width&equals;"204" height&equals;"135" &sol;><&sol;p>&NewLine;<p>メディアのアップロードをします。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7133" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD06&period;png" alt&equals;"" width&equals;"505" height&equals;"360" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>ファイルを選択をクリックし、貼り付けたいPDFを保存場所から選択すると(ドラッグでもok)<&sol;p>&NewLine;<p>ファイルが追加され、ファイルアイコンの横に「編集」ボタンが表示されます。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7134" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD07&period;png" alt&equals;"" width&equals;"531" height&equals;"83" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>「編集」をクリックします。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7135" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD08&period;png" alt&equals;"" width&equals;"503" height&equals;"191" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>右側のファイルのURLをコピーしてこの画面は閉じます。<&sol;p>&NewLine;<p>WordPressの投稿欄に戻り、PDFを貼り付けたいところにカーソルを置いて「LINK」をクリックします。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7136" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD13&period;png" alt&equals;"" width&equals;"503" height&equals;"162" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>リンクの挿入画面が開くので先ほどコピーしたURLを貼り付けます。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7137" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD11-1&period;png" alt&equals;"" width&equals;"502" height&equals;"175" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>リンク文字列にわかりやすい名前をいれます(例は「PDF」)<&sol;p>&NewLine;<p>リンクを新しいタブで開くにチェックを入れます。<&sol;p>&NewLine;<p>これで、URLが別ウィンドウで開いてくれます。<&sol;p>&NewLine;<p>右下の「リンク追加」をクリックします。<&sol;p>&NewLine;<p>投稿画面には図のようにPDFのリンクが追加されます。<&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7138" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD16&period;png" alt&equals;"" width&equals;"501" height&equals;"146" &sol;><&sol;p>&NewLine;<p>テキストモードでは ↑ のようになります。<&sol;p>&NewLine;<p>ビジュアルモード ↓<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7139" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD17&period;png" alt&equals;"" width&equals;"507" height&equals;"129" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>ビジュアルモードで確認すると、「PDF」というファイル名で貼りついてます。<&sol;p>&NewLine;<p>これでPDFが添付できました!<&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;&NewLine;<&excl;-- WP QUADS v&period; 2&period;0&period;92 Shortcode Ad -->&NewLine;<div class&equals;"quads-location quads-ad" id&equals;"quads-ad" style&equals;"">&NewLine;<&sol;div>&NewLine;&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<h2>アイコンの表示方法<&sol;h2>&NewLine;<p>このファイルがひと目でPDFとわかるようにしたいですね。<&sol;p>&NewLine;<p>よくみかけるPDFのアイコンにしたいんです<&sol;p>&NewLine;<p>こんなマーク<&sol;p>&NewLine;<p>  ↓  ↓  ↓ <&sol;p>&NewLine;<p><img class&equals;"alignleft size-full wp-image-7140" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD22&period;png" alt&equals;"" width&equals;"129" height&equals;"81" &sol;><&sol;p>&NewLine;<p>これはプラグインの導入で簡単にできます。<&sol;p>&NewLine;<h2>MimeTypes Link Icons のインストール<&sol;h2>&NewLine;<p>使用したプラグインは「<strong>MimeTypes Link Icons<&sol;strong>」です<&sol;p>&NewLine;<p>プラグインの新規追加から検索欄に「MimeTypes Link Icons」と入力します。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7141" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD18&period;png" alt&equals;"" width&equals;"500" height&equals;"482" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>今すぐインストールをクリックします。<&sol;p>&NewLine;<p>インストールできたら有効化をクリックします。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7142" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD19&period;png" alt&equals;"" width&equals;"359" height&equals;"239" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>ダッシュボードで左メニューの「設定」から「MimeTypes Icons」をクリックします。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7143" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD20&period;png" alt&equals;"" width&equals;"337" height&equals;"96" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>「MimeTypes Link Icons」の<strong>設定画面<&sol;strong>が表示されます。<&sol;p>&NewLine;<p><img class&equals;"aligncenter size-full wp-image-7145" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD21&period;png" alt&equals;"" width&equals;"504" height&equals;"528" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>PDFにチェックを入れます。<&sol;p>&NewLine;<p>他にもExcelなどいろいろあるので<&sol;p>&NewLine;<p>今後添付しそうなファイルのアイコンにチェックを入れておきます。<&sol;p>&NewLine;<p>サイズはデフォルトでは16×16ですが、<&sol;p>&NewLine;<p><img class&equals;"alignleft size-full wp-image-7144" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD23&period;png" alt&equals;"" width&equals;"113" height&equals;"70" &sol;><&sol;p>&NewLine;<p>少し目立つようにしたければ、好みで大きさを選びます。<&sol;p>&NewLine;<p><img class&equals;"alignleft size-full wp-image-7140" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2018&sol;04&sol;PD22&period;png" alt&equals;"" width&equals;"129" height&equals;"81" &sol;><&sol;p>&NewLine;<p>アイコンの位置は文字の前か後を指定できます。<&sol;p>&NewLine;<p>Display images on left or right から選びます<&sol;p>&NewLine;<p>設定したら下にスクロールして「<strong>変更を保存<&sol;strong>」をクリックします。<&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<h2>PDFの添付 まとめ<&sol;h2>&NewLine;<p>やってみると添付もアイコン設置も簡単にできますね。(^^)<&sol;p>&NewLine;<p>ExcelやWORDのファイルを添付する方法も同じです。<&sol;p>&NewLine;<p>必要になったら、いろいろ試してみてくださいね。<&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p><a href&equals;"&sol;&sol;www&period;blogmura&period;com&sol;ranking&period;html"><img src&equals;"&sol;&sol;www&period;blogmura&period;com&sol;img&sol;www88&lowbar;31&period;gif" alt&equals;"" width&equals;"88" height&equals;"31" border&equals;"0" &sol;><&sol;a><br &sol;>&NewLine;<a href&equals;"&sol;&sol;www&period;blogmura&period;com&sol;ranking&period;html">にほんブログ村<&sol;a><&sol;p>&NewLine;&NewLine;

モバイルバージョンを終了