tag:blogger.com,1999:blog-377984352024-02-20T09:20:26.165+09:00BloggerとWriterで楽々ブログ作成画像をブログに挿入する一般的な方法はローカルにある画像を参照から取り込むかウェブ上にある画像にリンクを貼るかです。これがMicrosoftのWindows Live WriterとGoogleのPicasaを使用する事により編集後の画像をコピペでWriterに貼り付け、そのままBloggerに投稿する事が出来る様になるのです。Unknownnoreply@blogger.comBlogger56125tag:blogger.com,1999:blog-37798435.post-81846891073589016902016-01-13T09:49:00.001+09:002016-01-13T10:32:27.881+09:00Windows Live Writerの代わりにOpen Live Writerで<p>Bloggerに投稿する時、いつも使っていたWindows Live Writerで、投稿できなくなった。認証テストではねられるのである。恐らくGoogleのセキュリティが厳しくなったからであろうが、Windows LIve Writerは2012年のあと、バージョンアップを行っていない。 <br />これはいよいよBloggerにログインして、ブログを作成しないといけない、と思っていた矢先、Open Live Writerの存在を知った。このことは窓の杜の「<a href="http://www.forest.impress.co.jp/docs/news/20151210_734662.html" target="_blank">Microsoft、ブログ投稿ツール「Windows Live Writer」をオープンソースに」</a>に詳しく書かれているが、ともかくインストールして見た。 <br />これまでと違うのはOpen Live Writer起動時の設定でブログを選択するとき、「Blogger」の名前が出て来たこと。そして、その「Blogger」をクリックすると、Google側での認証が行われる仕組みになったいた。それが済むと、あとはこれまでと同じ。 <br />いまの所、メニューは英語だけだが、いずれ多国語言語仕様になると言うから、待つしかないが、Windows Live Writerを使いこんできた人は大体の感覚で出来そうだ。レイアウトは前と同じなので、置き換えて見ればよい。 <br />途中からだが、その流れは <br />(1)認証リクエストで「許可」をクリック</p> <p><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhX41HnCYe3ReRcbZX-cGsRlxtHkvmyCxia8Rz1AXMunxz3ZXJv095FD2VfI9yGM5OiIhK6ivkzzvQWdtVuu_q9Znkhy4cqYck5Vz_qeM1j97n1tlPB_b77Z1Wr7IHTSMVXLNVH/s1600-h/image%25255B12%25255D.png" rel="lightbox"><img title="image" style="border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5SLoxK_cxcQNnbwBGuyvrA4_S6xYv9sgYavFq4VtG7lZr5PiN_eGWMDX7JVuWnz6rPfeH28zTHigjsN3pJaXwDwUQLRlrEe1neQt04AC1WXIHdDDEEKc-wDNjuoNO_gW6cOjC/?imgmax=800" width="464" height="450" /></a> <br /> <br />(2)認証コードを受け取ったから、このウィンドウを閉じてもよい<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRIQ_Urp0KWrAITSBkD6Zf3QRHedC8jKYQyvH6vWnb6sUqpAzu1MYuofnQsgUhBN7dS9UBZAZwWnSCiQaXtyepZeW55GB2t-3WibcOqIiFwlzP5QY_Oqg8OP1BEAjMehkw6-fe/s1600-h/image%25255B16%25255D.png" rel="lightbox"><img title="image" style="border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinAs0phO1WQ2XqxfRdHWfzqOoVCSbM0mBk0gBG98I1X8X2cUMv_l_AQZOsSUUZzhcdVzaTNRfigf2OgyOsW2wVUuAEheacixGtAv_7xPHihyVx_2BYAXiXHVVuS01yOCoEeyrD/?imgmax=800" width="515" height="32" /></a> <br /> <br />(3)ブログ名を選択して「Next」 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1QFr_zisbEMHGmntR3GULo35ZwlvL659Hi-qe2VxnwWrbeTojc7iDhZ7dDf9MusEz0QIGxlQbUxwLPY5kGJG4emWrazHWAbU-u0Q2c4lU9gqQkWUUKpGzuUTMwRoJVpkzTLD4/s1600-h/image%25255B20%25255D.png" rel="lightbox"><img title="image" style="border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhikarsmuVDluc2yfMlzhY3IT3wcns0_C-8nWatxLHiHYug8WJzJDMofm11S-yZM4TQeFY160Ue-kontn9uoOe5qHlJ4wqZw-iFxqDA095lC9tkwWcn2zS6A1WyKlCXXmD5TOTo/?imgmax=800" width="460" height="384" /></a> <br /> <br />(4)レイアウトファイルのダウンロード <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrNkZ6qk_zYEcUUWMuujUXKYWSOHkOZnDfFc_-OZTOvuZGyG0XEMlhi9hJPSeQ_guzCmAI88lrJ418IVt8p1lob8M6jaxuJdvcM7pw0ayH18FBcce4JYDFG5oufgDq59kb0pIE/s1600-h/image%25255B24%25255D.png" rel="lightbox"><img title="image" style="border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqFUTCWnfm2Ua18JV8oBikbHrYb8C3DJ6IpNEav3LKLHlfE7n-RKUVINhUX0GkDqQ1hUz1UrRaqpnePDuW3T2Dp2p2hlXPRcyZHlzl6DTzH9gggo48GUru8GPy25PlXWGf7pGg/?imgmax=800" width="460" height="384" /></a> <br /> <br />(5)ダウンロード完了(Finish) <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPK4zYeHONMDr2_bL_eWQSsmDwDOhg7jhKjjLtVYPS21h9HzHSUzgPXcU21SEFVPBa9agrznGJeBKZI4PNepNcG4ePxO4nM6l7OBIyVSQhgfEUN6Orup7BChgJWX7TfD1dUbWr/s1600-h/image%25255B8%25255D.png" rel="lightbox"><img title="image" style="border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3-n5DbSgjXAUuE1UoT2eL4Q_FJ0Jn2BV8VMNZM5g1Eh18kZkrmq7rz_vpFIp1ps_JnUXBbOU_fq2GqZo0Z624wybxCPBDuQuaLxGLks_xhguis-3JtEUiWr7x8o9ffd8rK_ep/?imgmax=800" width="460" height="384" /></a> <br /> <br />(7)起動画面の一部 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi-UIxlX52oZNMD1zb6Kyz4liHNECKPxGRtlJINAKMdcVbRVshs3B2J0vYlnCRp28JGarU3zGU3Cg3pIAty17-eOqRPBnn1TTMPiFBMAEdlS4z-76qe8CTKX0mRNyGUqg0F7yq/s1600-h/image%25255B29%25255D.png" rel="lightbox"><img title="image" style="border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjgylZU6Sm2ifqV6gzJobVvFDJjhNnd8ObbvyCxKyiNWlPEoiQp-yrznzZZw4i0juMDWpXQTcEtaWA3413E0eGeIZBxPw1pOGgHIoMMQdcDMFtOdmQ3vZ_u6kh46llv85dKqjM/?imgmax=800" width="469" height="151" /></a></p> <p>●<a href="http://openlivewriter.org/" target="_blank">ダウンロードはOpen Live Writerサイトから</a>(英語だがページ上のDOWNLOADからできる) <br />●この記事はOpen Live Writerから投稿しました。投稿はPublishボタン。 <br />●画像のサイズ変更は画像を選択し、「Picture Tools」から行う。 <br /><a href="https://lh3.googleusercontent.com/-Q2MkeQ2HS1k/VpWo_10ZEXI/AAAAAAAAMq4/CF_2UJ4Aih8/s1600-h/image%25255B35%25255D.png" rel="lightbox"><img title="image" style="border-top: 0px; border-right: 0px; background-image: none; border-bottom: 0px; padding-top: 0px; padding-left: 0px; border-left: 0px; display: inline; padding-right: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiL5xnK1A_JEQ5qniRJSJOG11X5CuMBbG8w9WvC1-qNt8c1jpW2vcLUSzxllVQuj99HG3n_s_F3UfQrm16wPYJel15OxsAf_9n37L4XLbqyOEO6cc81t88zi-LWtye8y4NxJfiT/?imgmax=800" width="522" height="211" /></a></p>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-83238520934333142542012-08-16T13:14:00.000+09:002012-08-16T13:14:59.225+09:00BloggerでLightbox2を文字のリンクに対して使う<p>Bloggerの最新テンプレートでは「ライトボックスで画像をアピール」(設定/投稿とコメント)が「はい」になっているので、標準でLightboxが使える。 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9MM8fFbDGxHGfTXSWodAx_D5ZYMZ_BXX6B7sccMWgTmhSGnW0mmGlQfnYKTtok_JufI5mSEof3zUmCf-6bkQv6pjqwgGCDKENDGPwiC-baUneXGLmozufOYgICqK4_QHgGO4v/s1600-h/lightbox%25255B2%25255D.jpg"><img style="background-image: none; border-right-width: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px; padding-top: 0px" title="lightbox" border="0" alt="lightbox" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhggRIk451qCy7edKECI0tfPzP-Z4WLfE0sZXYLTLQQG6Z1Xe1-H2fiQvIJVstt1qS5yZxqsIO0JWFxbPKuo3t_sm7xzqpCKtcDLR2OxwY4-1llLLojvaGLqme3NKlEmHQopTj6/?imgmax=800" width="524" height="220" /></a></p> <p>それでは文字のリンク先を画像にしたときも、Lightbox形式にするのにはどうしたら良いか検討してみた。 <br /><a href="http://lokeshdhakar.com/projects/lightbox2/" target="_blank">Lightbox2にアクセス</a>(Ver2.51)すると英語だが説明文がある。 <br />それによると必要なファイルは <br />jquery-1.7.2.min.js <br />lightbox.js <br />lightbox.css <br />close.png <br />loading.gif <br />next.png <br />prev.png <br />の7つ。 <br />先ず、これらを適当なサーバーにアップしなければならない。 <br />ここでは無料クラウドDropboxのPublicにlightboxフォルダを作成し、その中に7つのファイルをアップした。 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6GFuNoJM4tE8eVxsOutRX1MFUmELsZeoFrk00jC2yFlWdQyWmgIVH_P8pRSO-3kt3TWX35U5XKPFvos1IMEbRPKVDfJyims9RxH_5asn9CvktcIyrrGKVVyBLRAIaGtfRqWHz/s1600-h/image%25255B2%25255D.png"><img style="background-image: none; border-right-width: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px; padding-top: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh93-eTWbfj6jvoKwVE6oPS1WojCcAovLqbLskImYlK_kmqAWqZBDxIhtO98OuTXQFl_XUSnjVs9b0vmDnu-3XZdu7Aq4bDQ5KRA7-3Alq2Z7-w16-R_lLp9RJG6nYqsPDirCr2/?imgmax=800" width="524" height="271" /></a> <br /> <br />そして、jquery-1.7.2.min.js、lightbox.js、lightbox.cssのパブリックリンクを取得すると、Javascriptは <br /><script src="http://dl.dropbox.com/u/********/lightbox/jquery-1.7.2.min.js"></script> <br /><script src="http://dl.dropbox.com/u/********/lightbox/lightbox.js"></script> <br />CSSへのリンクは <br /><link href="http://dl.dropbox.com/u/********/lightbox/lightbox.css" rel="stylesheet" /> <br />但し、********は各ユーザに割り当てられた数字。 <br />これらの3つはBloggerのレイアウト「HTML/JavaScript」に挿入して置かねばならない。 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5MFMzmdbalC4E_r1c2ulgdvCuCZO8rhu7r5K7S6jqojwg-sgo3MWZFwP_vIjXr1qZRYM5onrPbwHteSUcoNdrovq4JNk5RBnWI4eXTXgijdjJCH4Ed7okUcOASfZE5cCK5VRq/s1600-h/image%25255B5%25255D.png"><img style="background-image: none; border-right-width: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px; padding-top: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbYXUmufjnx5QsAWdEAk0a3_nlCvbDNOlytfTIEAiN2gTBcQcYNcJLFCkJ1wka36B8aM4a3LY5IrgXlCfj4ifYRZIParG6slFs5OxOQJz38D7O3kkv0fRxbNYdPXNVNChsjdKo/?imgmax=800" width="474" height="524" /></a></p> <p>これで準備完了。後は実際に使って見るだけ。 <br />例えば画像をDropboxにアップしそれにリンクして見よう。 <br /> <br /><font color="#ff0000">●</font><a href="http://dl.dropbox.com/u/48159704/lightbox/lightbox2.jpg" rel="lightbox">ここをクリック</a>すると「Dropbox/Public/lightbox」内のファイル全体が大きく表示されます。 <br /> <br />を作りたいときは先ずリンクしたい文字に対して、普通にリンクを作成(図はWindows Live Writer2011の時)。 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqmE_VZw90ikNmiw_EmddR1DTHWGVnn2DiCcXpY-rD0V6Ay8RqdDGMw1XLnDl6-Lytp3qWb4xeVjCRopHV6ID7h8E5Jm06alsJURRcr_N4ICQ1_a-QwQF-ESUZcEQc9pr1oPLj/s1600-h/image%25255B8%25255D.png"><img style="background-image: none; border-right-width: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px; padding-top: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAJ8zjDNN7Q5UyqyiJ6pO9Anj-P6qbQyuG7kwe-UTabkAWWXIZQD5CJvsbnlzN_4q3Od9YoafIdtJQ9kMgMnnicy4rGrnbPGak9OQNzf-_2qTQVkye_GrqnSKs6BhyphenhyphenmLHMRtbH/?imgmax=800" width="524" height="263" /></a> <br />次にソースを開いて、 文字にリンクを張った画像(lightbox2.jpg)のあとにrel=”lightbox”を追加します。  <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhB6aHazMMdKfzPmxxjAfna_FC9fc-ePlAW41YhSGd2ilKaOcvYONdNUmezxobG0tPWEPmR8lI5zCHt61_XRQR8DS6R-ht-jHiJAuXYc7Int6Ot2h0adBgorTdqiZZuktIG96F2/s1600-h/image%25255B6%25255D.png"><img style="background-image: none; border-right-width: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px; padding-top: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgygMRH6NjHRkmIMmCkwC1O-iMZMGwzdToSo5SK9AZEvGl6wY66CJSux9B0tW24nkSTZtJ-J-7Q_ZmqRUXk6z6iDCFknFXB9n54qM264T6KCRNAwFt6CNDUqmlDBGDgjSkie9XW/?imgmax=800" width="524" height="62" /></a> <br /> <br />また<font color="#ff0000">●</font><a href="http://dl.dropbox.com/u/48159704/lightbox/lightbox3.jpg" rel="lightbox">ここをクリック</a>するとBloggerの「HTML/Javascript」の大きな画面が表示されます。 も同様にできます。 <br /> <br />もし、連続して画像を表示させたいときはrel=”lightbox[kakudai]”のようにします。 <font color="#ff0000">●</font><a href="http://dl.dropbox.com/u/48159704/lightbox/lightbox2.jpg" rel="lightbox[kakudai]">連続画像1</a>、<font color="#ff0000">●</font><a href="http://dl.dropbox.com/u/48159704/lightbox/lightbox3.jpg" rel="lightbox[kakudai]">連続画像2</a>  <br />連続画像1をクリックし画像の上にマウスを当てると次の画像を示すアイコンが右端に出ます。</p> <p> <br />画像にタイトルを入れたいときは同様にtitle=”ライトボックス画像” のようにします。 <br />タイトルを入れた<font color="#ff0000">●</font><a title="タイトルを入れたサンプル画像" href="http://dl.dropbox.com/u/48159704/lightbox/lightbox2.jpg" rel="lightbox">サンプルはこちら</a>。</p> <p>●尚、このブログはライトボックスに対応していないため、画像をクリックすると大きな画像は今まで通り次のページに表示されます。試して見ると違いが分かります。もし、このブログの様にライトボックス非対応の場合、画像に対してrel=”lightbox”を追加すると文字のリンクと同様になります。</p> <p>※関連ページ:<a href="http://cloud.www13.net/">無料クラウドDropboxでWindowsとLinux(Ubuntu)を同期</a></p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-59500169414770161372010-04-09T15:45:00.001+09:002010-04-09T15:45:42.243+09:00Bloggerにカレンダー式アーカイブを追加<p>ブログのサイドバーにあるカレンダーの太字の数字をクリックして過去に投稿したブログを表示させると言うのは良く見かける方法だが、なぜかBloggerにはない。これをBloggerで実現させるには「クリボウ式カレンダー」のウィジェットが簡単に出来ていい。以下はその導入方法です。 <br />(1)<a href="http://www.kuribo.info/2006/11/blogger-beta_25.html">クリボウの Blogger Tips: Blogger beta にもカレンダー</a> にアクセスし「カレンダーを追加」をクリック <br /> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh12IQtK1VFRGhdw5rSiwocKL9HvyDKBnlvWnnCnnd7Ta8u87DeMrSnGBmNxSulTxsX5uxiigG-JCvC5wiZmlG53OPcS-Hc-R2xkVRmS6dhDcb1vH1qtObhCQsW6kWULgbJaHGG/s1600-h/image8.png"><img style="border-right-width: 0px; margin: 5px 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6HO9hfe_1w8zba-XRxDsF0dTHM37MpjJq9Mad9gYAv4lfbMIHrItwCSETEwSnuG9Qn5IzVEFohxZdCqPzC07jmJYMOC9k_m-sxn8J6HCE31RGDNw6M9c9dxa9Dy5recqGMchQ/?imgmax=800" width="504" height="116" /></a> <br />(2)Bloggerにログイン(Bloggerに自動ログインしている時は出ない) <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVG124RGLavV7zBtH0n3onE3MsRXKYUagpjyEt0DxVhKgk3pgj_PHPWgC1R6D8pZ4NECOf1YB7e8FLQQRcLb8i4vIqMySCi9qFpdqVnI2EdCN4Gsqh07bcsjZfU1mFkna5UmEY/s1600-h/image11.png"><img style="border-right-width: 0px; margin: 5px 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG3coCb2wm2OucOFcI5ES5HFlpiO7AIrPR2dsPUPkUmpf9-w_9zyXkSVTIcBp9X7vFJXGpbaG3weWGZqkhlIH4B6Jk_GuVEW_6tOJl_ErAzw5uuBOafWZSMVG4LzjNH2HzSNt_/?imgmax=800" width="504" height="224" /></a> <br />(3)ブログを選択して「ウィジェットを追加」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-kOlvRI7MvQ3SUaV33ePpzPFlfqV-W2ltlnlNsfmLm99Id0g7v3W5ct8VaXKnhtkuAL4MfMFycxStSLr8C-6jXIFLxpXj0wfsrpiJ5kpqOJinRFITeHNSRCLz9sIvERWUMSEu/s1600-h/image2.png"><img style="border-right-width: 0px; margin: 5px 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDztqCsIsLRA3j1fK3cgIF8aXiGDnEG4y19wrdzddZ4RlYqpDFPYptXi0fMEiyzHmSUVcOAQVeQYml7oTGm-IkRpvUDWKKU75Pa7Ka4-ZlK-ilYnKofRN3O8_ZuFCZ-PjipMbu/?imgmax=800" width="504" height="405" /></a> <br />(4)Bloggerのレイアウトで挿入場所を編集 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVxT0HsPhI7fFxCho4hnqK4Dyfjn2Evm55aThiLBJac68ybC_MMXTW8hQPIGjQk1jPxeAhsPmfFtr5ogXPWNWwRGrykZP_7TovQtnv6mYHTImOU2pPGSoyonD2DkETSay-WLkp/s1600-h/image14.png"><img style="border-right-width: 0px; margin: 5px 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjerqgXm4W6VofYvy8nDE9gxEahd1qljWHiFSOn7XFgdQDch0JIUivRZtC7464HnbFRB9LUa0Jw6w-Tfrf7iOykcWT3s-r0VYAYU9klapZbgqB8U8ki80IO634vjUaHS7Zp-jrM/?imgmax=800" width="368" height="504" /></a> <br />※このカレンダーを追加したブログ例は<a href="http://aurunetto.blogspot.com/">こちら</a></p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-7005822313027177502009-12-15T08:30:00.001+09:002009-12-15T08:30:57.598+09:00Picasaウェブアルバムの画像をBloggerやLive Writer等に挿入する方法<p>ホームページやブログの容量が少なくなって来たら、Picasaウェブアルバムを利用すると延命できます。 <br />手順: <br />(1)Picasa3でアップする画像を選択したら、右クリックし「ウェブアルバムにアップロード」を選択 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjD_qsMOJAeFIbigpyEwAu6soQJaivNNNoUVJybwrTWGzvQifCwYtZDzLsOSPp-f1vDo8Ily1OsU_qRHRekEs9Yfg3xlHlSvGwXFTPdxKxcXmgf1wYpDqJtDvZV1XrgqUmtmeTB/?imgmax=800"><img style="border-right-width: 0px; margin: 5px 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4b8jtV3XEvj68nfMaGG3hy6gpK1lF59BGRCl4l8s20L1Ox2XdD0y54eN8ofREtllqLszB8N2QKgakWt4oBMMWVTz6PhQ_yg97SGt9nAatYksyQL3rLr03N_rhq-FZqZ1eO3c9/?imgmax=800" width="415" height="230" /></a> <br />※複数枚の画像をPicasaウェブにアップするにはトレイから「アップロード」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYIhZdx1NKQyNEzYWpJ1NFH9WgxETNeG6XwwTKOnJ4y6VsccI3p0Xipb6a8rMxfrQV8Eu39Cz3kYgZn5k_Jf-2eUBS11WgkQFR2UU7h_cBEte9lAm5cdPydEr5MwPm_b-3SiQd/s1600-h/image%5B36%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEio_az__3BLV5gmsa0vCdp9pX4JdgkZNE78-4fbaru3FejVkWtXTpA5hdqOYJ_27L4s9Lug5KyyDje0j3cfydbfLPT9Y-CIppYyt_kQrmGhkAp6s42176qa6VY3w_1oWML1qlDQ/?imgmax=800" width="489" height="78" /></a> </p> <p>(2)アップロード先のアルバム名やアップロードするサイズを決めて「アップロード」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitr-s5T5dNr9MM-WL5D2G6LhZsewqL30ciMeO2sIFLTrlMcPm8oY6rTm5S2Jj7zELn1w0lLCdb9A0A6iKAgc8vryfb5Jv12YyzBMOkcqp3ukNDDpgMSsL2J7Qkhob2ANJ507r_/s1600-h/image%5B5%5D.png"><img style="border-right-width: 0px; margin: 5px 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7fuY3RQcFO8ZWDkX33vz4yrZWtC15luJySnMNcSv1combpqB9egpYxw8HhOba1aQNFY5gs9rYu2SimsRFxPYE3AjLnWl8sBFD6IlxWlTPKzFq75czDW_xBegm25JDAgxSd1fl/?imgmax=800" width="480" height="504" /></a> <br />※自由なサイズ(800X600等)にしたい時は一度エクスポートしてからPicasaウェブにアップロードする。</p> <p></p> <p>(3)「オンライン表示」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeYNo7r0FsjwKK1M5q2W0cPfIaNpbrET6eT_Rbkn-9McibBdDtuJ3gQ33hu0JOwjeTAjjU4fNSSpiQDhEHgob2u4LqXU1D-6rQ471-Ea4TST1nttSCRx3ki320cxbzHLKJjW_T/s1600-h/image%5B41%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzO88Vj9w7KrLOwgElHr-3goDX1rYt-b1bcQIb53M2CFmGjqO4JC2_cLpN5y0GSmwD__vRisXyTAiRyER7aitg-gXWEBErfHvTX9hTO91vkou-cLvoM7mkNYf39OLz6btvELEc/?imgmax=800" width="479" height="292" /></a> <br />※一度、「完了」させてから、ウェブアルバムにログインしてもいい。 <br /> <br />(4)Picasaウェブにログインし、画像が表示されたら、画像の上で右クリックし「プロパティ」を選択 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTMs-v14HtE4dwoN_jSgBlnIoSQqlHCABGuyjfvgPEQJhyO4U6-KOADayT2YUmlfzZh7EICEmTYPqrIDbZGgTxXXJt9cDxTjb-McMqrsebpBMHK5fwI1D40vwDS8HTnjQK92XP/s1600-h/image%5B11%5D.png"><img style="border-right-width: 0px; margin: 5px 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhE47vS8E4QwBkPjRaakh1qi0T3uiuwBhqChtLXjfZJjM8jrPNY2fWFBAKI9RIA12gQGEexnWXqQvZlPwPAamKtTUOytRFKMC2LRSTqOTGa6NguYahv8Ff_CM6kFMoeVrDh-ybF/?imgmax=800" width="464" height="316" /></a> <br />(5)アドレスを選択し、「コピー」を選択 <br /><a href="http://lh6.ggpht.com/_MOvYiCUSqkI/SybKgivVCbI/AAAAAAAAJ-I/-Vzt_77yio4/s1600-h/image%5B14%5D.png"><img style="border-right-width: 0px; margin: 5px 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOGZfXIAVroMi5OADiXxOBYyQktaybOdItjgqULDZryWSLe6NV5NXiJYH4Aa67SI1FHYzcm-GzPCVOJxEOpU5lNS-KEEpSyWUo_JVWwzbMtY_zyKx_1WvGC5B6htsQS43CPifS/?imgmax=800" width="481" height="158" /></a> <br />もし、ブラウザがFirefoxならば「画像のURLをコピー」を選択 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkc85SF6ewOEGKwy6PfKec_ACN_KTevvQO3QfW7tDLROn_e3UslRkXM1IM4yzvk0LCKSVk1sdlKSnOZMdA0Md6dZS4AovYGlpE6SU1eZ-KuJloL5isbZecdQhQbyZhJNthAwLR/s1600-h/image%5B20%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhjQbEnwdFJZT3dPdAk1oOP_DG2bWyLYO9N8F71HXGgG-h3Dpuq-dbxKScFM0NXGDHMtvF5ETz1mT3VGrwx2JdbL0nG7k4Z-t5SXryXi8AqIo-RgNVo6SQTVOkS8qJJcPJxtBf/?imgmax=800" width="446" height="216" /></a> </p> <p></p> <p></p> <p>(6)画像の挿入 <br />・<a href="http://download.live.com/writer" target="_blank">Windows Live Writer</a>に挿入 <br />「挿入/画像/Webから画像を挿入」を選択し、「画像のURL」に貼り付けて「挿入」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSqLv-n6ePBH0JzgISqiBgst1k6DlNKTJ8mocVxQ0nN6trQ3ZXwaGYL8RVsdEoYk3YLJgrWGj40PnMvkJNuNWqHsWjbTT88xTWWin2JBJ3LLLoALgI41NUCKqqAr7eL9rzvXB8/s1600-h/image%5B40%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw8PwSJPoxE3SKAuTDsb_tCSC6ANkfjjc-dyYj9iJ4hb-RKdndprcSemxsWOF8VUyoFnfEgmYtczTfPOPxh0I97bmRsRUNmfEd-lUg1wJXUwd9yyCv_ajalGTgV2BsXr5b0VuI/?imgmax=800" width="472" height="327" /></a> <br />挿入された画像 <br /><img style="margin: 5px 0px" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRlGytBAIrUoVpikZ_FXYfFTmNxRP9tHmaU2RpcSJ6l_GUbN0KbhsJCOuRJnLQNv4qycvJymKRib5G_Sv1khNNEdhno4v-ZWFyI4oA9c6FGJiIBqyzTS1aXwV7p-BcQHKcJK6A/" width="458" height="300" /></p> <p>・<a href="http://www.blogger.com/start?hl=ja" target="_blank">Blogger</a>に挿入 <br />「画像を挿入」をクリック、ウェブアドレス(URL)にチェックを入れ、「画像のURL」に貼り付けて「OK]をクリック <br />但し、下の画像は「新しいエディタ」のとき <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiR_sdJaDgIyLvY3CIiwxg9a3zdoP-nEzvCf-TWecmBAnaC9Mz21dCc9zSd2ktNVNDZk-MMxgVl9H356L_rBEGAzWdcaS5PF6wyS-pJWrXCQ7KXgnERIPw9HB78JGaFgzf7GfZr/s1600-h/image%5B38%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3CdMor5owdWQkAfXrlADVNaU2h4Zvqs5g9mDMtp9Q7MWQs0at-T7vguJTSwieX_Rg0Rj1mz4_FNl__GuILc9Ck4FW7feHFx3m87ZkxyPGULbgJLDPameLrAa0140ZxpjiyUKX/?imgmax=800" width="447" height="310" /></a> <br />Blogger作成画面に挿入されたとき</p> <p><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijL08gTCCYy5BBzVRf4FX8857SLXSFq1TbsEUqjSTcUQaeKi5yZjL0e0XmLDTE-72OnmA4GMNJFb_VEowFj2ELhW2M7-0Z9Wsw3AU1sIbC7hS_6bwjnJ7AP2-a6YgoO3T2UGQR/s1600-h/image%5B39%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi30zBOEMH7Wa_8Z2M7fT1hBYJWIOFT99Gi3MpbR732T1zVoQzM7Uh6xba4r7LgAGrrs6Yrs-D9g4lIHYgJyM9QBEAjD3eSXUf3i6oLn6BLpZQhWoQGCNusuFmMBE1siFeEfOtJ/?imgmax=800" width="452" height="282" /></a> <br />・<a href="http://www.vector.co.jp/soft/win95/net/se272154.html" target="_blank">alphaEDIT</a>に挿入 <br />「挿入/画像」で <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPWg5LM42s4VwdPq5BSf7GKU6jEbCLjWP3ZAZwZF81-0BF0MDiSIMmtaW48PiZnQopz-s68JIYtEX4fgDpHJC7HpCLKzSPBICYC67fGlmsVXlrzYMI8KKhKQfq5XybFdaxkFUu/s1600-h/image%5B29%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="http://lh4.ggpht.com/_MOvYiCUSqkI/SybKqMxtJuI/AAAAAAAAJ-8/NElWatpnpEw/image_thumb%5B9%5D.png?imgmax=800" width="354" height="440" /></a> <br />・<a href="http://whzat.minidns.net/shoko3/PortableApps-KompoZer-J/index.html" target="_blank">KompoZer</a>に挿入 <br />「挿入/画像」で <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEje9klRlTYw9MvAzUhmKXO2A3lqwh8NnCfvY0ye2qjC1iIBNAtsQmKNO-28cJ7hnLMx_I1Atu1f3MlWv60DvVj6swgiOCBioY25spHbwDwLbmCNY6fDx4ntJpsAGWeDRRr7ogey/s1600-h/image%5B37%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy6vBBCtNMAOSJ_5wgN3eSJHIYE-8q5p_j-ZL2nx6-NpczLR0Lfi_8hrJNBSt1m5NAqTQBZx4EgYEUkrCTJ74sxyhQFEdTED5m_0JXY_wCSEZM1HqWrC5eqLLWWQFX197ZfHlE/?imgmax=800" width="381" height="336" /></a> </p> <p></p> <p></p> <p></p> <p></p> <p>・<a href="http://www.justsystems.com/jp/products/xfy_blog/download_le.html" target="_blank">xfy Blog Editor</a>に挿入 <br />「画像/挿入」より <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaTrAjxSf3I-ezppwsO7l-X2AnGCU3nC-WDGJeTJa_A8lZu8zTSpO5HY1INlQ3p3NThmLbid5Lg3tEYCPi3T_EK6XxuIuspLZyIOEBo7AuoovXIFB0e8wkeVux18Xh6ezlp9Xg/s1600-h/image%5B45%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUe3B05jfJZ4Ok2oQGbv1e6uawCPUjXzjXugIaxvwu7HHeh8JXMPi7HufaSOpCh5U1WIBEuwTrHTlvr2CBi85HQZ-MOA_b5IHL2IorxLrWEuC06v2wLArU_GkJuuEhQN3GTCRX/?imgmax=800" width="319" height="382" /></a> <br />※関連ページ <br />・「<a href="http://owlnet.web.fc2.com/health/amazake2.html">甘酒の作りかた</a>」 </p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-418644849638720002009-11-12T09:22:00.000+09:002010-05-06T06:32:55.560+09:00Bloggerの新機能「もっと読む」<p></p> <p>通常はWindows Live Writrerを使用しているので、気が付かなかったが、たまたまBloggerの設定を見ていたら、こんなのがあった。 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEia6IgoPKSyixy57y0WvBjRW6FV2T7NdNl5c_bojYF_-1AQRPHD5LgVDvKBJ1qjs-2M_FJvWqH_kuyMBZ0fVOV83O9UGpPQ1ZzjTP6dkT_GjlC6293G0kSuIzL-xVOAmr4Kt_Wd/s1600-h/image2.png"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTsrtuuCfAHCAw9XmPR54fLodRKEDeuGNQuAdYvN4cepZe1lq_L2v3VXXrEzyJDuaU7k9P5rqrH1NNJn1T_2cBj2bqTzCjpXVs0QSaQr0GJA_bdPUsV0nUno-b2AlU5oVslp8P/?imgmax=800" width="502" height="214" /></a> <br />○新しくなったエディタ とは? <br />ともかくこれにして「設定を保存」 <br />新しくなったツールバーの右端は「改行を挿入」とある。 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOlG_1M2M2V4LtFI7SkKiNnQPwmbzEE2YzZ1bAN-8iXRNn9x8JLIMGPi6CmYzXVWZvDu6q80W1Z9toX8JBLM5RpiBXI3ME4IxD7uALEVWQjvTtx5cAxhZf_zNt55IP5pgZIKY8/s1600-h/image5.png"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-Db8F7BLrMLS8nmsKSoiAo94f2RDx0Sg4o6ldB3XeQwWaL6cMOx8vxRO8b0SqDaDN5Em3cZnOyeTRy-z_5Wc7q7Jq5QRq79nVRIEjH2H_R_z2W0XWg4vJoWLKJZ9NLrc9oO-h/?imgmax=800" width="504" height="136" /></a>  <br />何のことかな?と調べて行くと、これが「続きを読む」の切り替え位置を指定するためのボタンである事が分かった。  <br />「作成」モードで挿入してみると点線で切り替え位置が表示される。 <br />追記:「<font color="#0000ff">追記の区切りを挿入</font>」に変更になっています。(2010/5/6) <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh04yWmTER2lbJ4jMsO8oMsuxS9eP_RxZjdgexohT24nwtzBsHSaSy4vkVxDHfGGtw6c4EesoZTkJJPgDKL6obLIXvCsKlL3xjT0WXnYClQN4wTcoqc-9FOxkuSDOX8rZBD_QSQ/s1600-h/image%5B2%5D.png"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjx43ZVr-ZZr9KlOXbPSEJ5hfgZToiHNtgYBuAI1YhMjSoa7dvJLbvizJpxBO07d5QxGR7AiN7fUYf0D0GIFje9OHlG3765iTcqgchn8vHERJCBSyxC4Pq2x3fhBaj-fjkGh_8J/?imgmax=800" width="282" height="94" /></a> <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi79XRnHgB2FicleBbmwkLUwVyQ8GKZ5ySA4F7xWmCxXlX2zjnONERCzXBqrgFRylkXVtY8PdFJZ7wCmtN9UyFy1kyyL21tv28DG5rgOigPBKgWaItBBB_TMJ064AnGRs-XT4vf/s1600-h/image8.png"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="http://lh4.ggpht.com/_MOvYiCUSqkI/SuivfQuikvI/AAAAAAAAJtE/b_J-tE9t0dQ/image_thumb2.png?imgmax=800" width="504" height="260" /></a>   <br /> <br />「HTML の編集」モードだと、この部分が<!— more -->となっている。 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-SAlas7-CSq42kGsgmo_APUf1_6frGlfwcSwh2oHn4x_niRq4MzpCTyFqB_m0m_mjsvNHM3ZecqY8Oy6vYyaxWGo_wrBfcp3EpglshiWFjm00m17rODaKXmzb845tMG6gzzO1/s1600-h/image11.png"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiM6_m-M-Xl16mF_K2Xs_fW3nUcv_LMycPKLUNhmWqzi5A1CfJkAjcU8v2Q38TDyWgNsu6EXhguf-9Xs35rrYXxWWBTqcNiyCW474yxRes8n5qb7hTSopr2UWsSJTPonSO5yxSp/?imgmax=800" width="504" height="203" /></a> <br />これを投稿してみると <br /><a href="http://lh3.ggpht.com/_MOvYiCUSqkI/SuivhDoeVNI/AAAAAAAAJtQ/HB_ajEeconA/s1600-h/image14.png"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="http://lh4.ggpht.com/_MOvYiCUSqkI/Suivh4WkBXI/AAAAAAAAJtU/dH9p54u17uU/image_thumb4.png?imgmax=800" width="504" height="128" /></a> <br />「もっと読む」をクリックすると展開されて次のようになった。 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieVAI3PJge09eMgOH1hmTaW4edIqjU9WzdiU4Q6OyjEBoZb3qcRdr7wTiXEo9BIiNSgfAoziNBEqc-dEFCkASTW58TeOSxa9iQ0qBeaG-XpxLxk-SemsLvBwzeqmyXujRsJJI8/s1600-h/image17.png"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-LysUNF4eqDw7bvquo-CgHzPXJ5X8cG_PS4hRmIEFaPeH6smlFs2TIFNJsRJgApiMyOt7DzNed-goYJqiIjySKjL3X9ygJ-Au_iLaW8Nr5MD0OpfThDtPdZR5V23svsazm0JK/?imgmax=800" width="504" height="156" /></a>  <br />もし、「もっと読む」リンクが表示されない場合は<a href="http://www.google.com/support/blogger/bin/answer.py?answer=154172">ヘルプ</a>によると、「レイアウト > HTML の編集」で「ウィジェットのテンプレートを展開」にチェックを入れ、 <br /><data:post.body/> <br />のすぐ後に <br /><b:if cond='data:post.hasJumpLink'> <br /><div class='jump-link'> <br /><a expr:href='data:post.url + "#more"'><data:post.jumpText/></a> <br /></div> <br /></b:if > <br />というコードを挿入すれば良いと言うことである。 <br />なお、「もっと読む »」の文字列は「レイアウト > ページ要素」の「ブログの投稿」の「編集」から変更可能。 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhREHlT6HF6WUvB2wm9iKvm7bP_uNID_YraCH7IqGjr931IKBgGwMVF3dfINewi-U0NWfcvhFvf4-Kkf7QirqYSRl5Q2MfNM88SyOWSvBm8gg4ZhhKnRNsNFNy0NCVgD47TLPPV/s1600-h/image20.png"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="image" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2UuuIzrl7x4_pVlhy9UnnqbRs0GJDR6gMXyJMNehzF6yPdz0dGNBa4d9uMpjQl7-w09GV0bh0vP4NeizOIAmBuAX75aOKh5mWkGb6JdJz1JO8xiWW4SKEIA5ff_ekQynyu-MR/?imgmax=800" width="469" height="120" /></a></p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-67039431850351704472009-07-26T15:05:00.000+09:002009-07-26T15:07:23.090+09:00「北大の紅葉」ムービー<p>下のムービーはWindowsフォトストーリー3で作成し、Bloggerの「ビデオを追加」で挿入したものです。 <br />再生させるには、ムービー左下の「再生」ボタンを押してください。 <br /><iframe allowfullscreen='allowfullscreen' webkitallowfullscreen='webkitallowfullscreen' mozallowfullscreen='mozallowfullscreen' width='320' height='266' src='https://www.blogger.com/video.g?token=AD6v5dx0tJAD3w-miGtu8aTvJeXZaVPG5qsHfTkDEoGcRArx_4t65KgtSjsDUm4lpcAjvyjfKzJGJCMrp4w' class='b-hbp-video b-uploaded' frameborder='0'></iframe> <br /> <br />大まかな作成手順は次のようになります。 <br />(1)フォトストーリーを起動したら「画像のインポート」よりムービーに使う画像を選択します。 <br /><a href="http://lh5.google.com/nekonomie/R1uTDSGcp0I/AAAAAAAACME/kqUTrPvwCvY/image%5B6%5D"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="88" alt="image" src="http://lh3.google.com/nekonomie/R1uTDyGcp1I/AAAAAAAACMM/uTC1vzk_if4/image_thumb%5B2%5D" width="294" border="0" /></a>  <br />(2)ここでは1枚目に対してエフェクト「ウォッシュアウト」を適用、2枚目以降は「無し」にしました。 <br /><a href="http://lh3.google.com/nekonomie/R1uTEyGcp2I/AAAAAAAACMU/XoesvXFxLbs/image%5B3%5D"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="320" alt="image" src="http://lh3.google.com/nekonomie/R1uTFyGcp3I/AAAAAAAACMc/95AwkrrZpFk/image_thumb%5B1%5D" width="504" border="0" /></a> <br />※Windows Vistaに入っているフォトストーリー3は下図 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipHCiiMiw8sx3BKYz2doZ4Mm-WYINZWGZicBxpcCvkqDYUFRVMe07uYfjL0srRqRMJQkwCcDiIeck3_Lna7FJS8rHlLUHkE2tkOwIQ6W69Vtj6Oefp0IAhxXcPWMT-Fywgn8bC/s1600-h/image%5B3%5D.png"><img title="image" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="232" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTBw-xKdhiBJpFFMcY5Gw2celsu3lsZaHYbctJMjVPosLZ2tVSdS6AM643y0uTkj6PEQkBgRIRUCwGI27ulzRrCjQdez4ZWOaguN4GTKH6Hpudiv8slKGOYgCYfpAjohEaSHKI/?imgmax=800" width="502" border="0" /></a>  <br />(3)「次へ」でタイトルの文字を入れます。 <br /><a href="http://lh3.google.com/nekonomie/R1uTGyGcp4I/AAAAAAAACMk/iXVgR9_xFmA/image%5B10%5D"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="375" alt="image" src="http://lh3.google.com/nekonomie/R1uTHyGcp5I/AAAAAAAACMs/AuKPx9GpQ-M/image_thumb%5B4%5D" width="504" border="0" /></a>  <br />(4)「次へ」で「アニメーションの開始位置と終了位置」、「画像を表示する秒数」を指定します。 <br /><a href="http://lh6.google.com/nekonomie/R1uTIiGcp6I/AAAAAAAACM0/e3krClAz9Is/image%5B14%5D"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="344" alt="image" src="http://lh6.google.com/nekonomie/R1uTJiGcp7I/AAAAAAAACM8/Hq_6R0F9Bng/image_thumb%5B6%5D" width="504" border="0" /></a> <br />※Vistaに入っているフォトストーリー3は「アニメーションのカスタマナイズ」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivI-FdBTk3ql7FzRe7gkEdHYYbq1yNNLJrLxNrIeS9WBMTAOF1Yw7I51VQw2ej2t9343snEuQwEUaGFvrM0lFiVsILNUovT2rqw2GYE6fx2LJE73mHs8uafPAOYC7IoEHS7mY_/s1600-h/image%5B6%5D.png"><img title="image" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="96" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtRpnKysDFNIrXHKO7oGvuwrdMsAM2DFbI3CfXHuqo2P4MzJenIhWgTGMQqY6oXrI8QmBmp4Bg_6eEWEbojMn-myt2kGSn7yly6OAMsQKDHvc_cO60tecJQtdjdlDFHypmTvir/?imgmax=800" width="497" border="0" /></a>  <br />(5)「切り替え効果」を指定します。 <br /><a href="http://lh5.google.com/nekonomie/R1uTKSGcp8I/AAAAAAAACNE/oTHTvffXmuY/image%5B22%5D"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="344" alt="image" src="http://lh4.google.com/nekonomie/R1uTLCGcp9I/AAAAAAAACNM/l_BUOWZylf8/image_thumb%5B10%5D" width="504" border="0" /></a>  <br />(6)2枚目以降の画像についても同様に指定します。ここでは「画像を表示する秒数」だけを指定しました。 <br /><a href="http://lh4.google.com/nekonomie/R1uTMCGcp-I/AAAAAAAACNU/iC7xhxIIXv0/image%5B18%5D"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="344" alt="image" src="http://lh4.google.com/nekonomie/R1uTNCGcp_I/AAAAAAAACNc/E_FZZyv8tCY/image_thumb%5B8%5D" width="504" border="0" /></a>  <br />(7)「次へ」をクリックし、BGMを追加します。 <br />ここでは「音楽の作成」より、次のように作りました。 <br /><a href="http://lh3.google.com/nekonomie/R1uTNyGcqAI/AAAAAAAACNk/CR3thOFDmDk/image%5B26%5D"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="586" alt="image" src="http://lh6.google.com/nekonomie/R1uTOiGcqBI/AAAAAAAACNs/_hGvxqjtvKE/image_thumb%5B12%5D" width="504" border="0" /></a>  <br />(8)「次へ」をクリックし、保存設定をします。 <br />ファイル名 <br /><a href="http://lh5.google.com/nekonomie/R1uTPSGcqCI/AAAAAAAACN0/OtuCLT4qbsg/image%5B34%5D"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="375" alt="image" src="http://lh5.google.com/nekonomie/R1uTQSGcqDI/AAAAAAAACN8/YZEt3PPp6B8/image_thumb%5B16%5D" width="504" border="0" /></a>  <br />品質の設定 <br /><a href="http://lh4.google.com/nekonomie/R1uTRCGcqEI/AAAAAAAACOI/jRT2TlZdmYU/image%5B30%5D"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="285" alt="image" src="http://lh3.google.com/nekonomie/R1uTRyGcqFI/AAAAAAAACOQ/-Oo3o0Zp4U8/image_thumb%5B14%5D" width="504" border="0" /></a>  <br />(9)「次へ」をクリックしムービーを作成します。 <br /><a href="http://lh5.google.com/nekonomie/R1uTSSGcqGI/AAAAAAAACOY/Hm3Ch4GIing/image%5B38%5D"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="164" alt="image" src="http://lh4.google.com/nekonomie/R1uTTCGcqHI/AAAAAAAACOg/n6RKijqygXQ/image_thumb%5B18%5D" width="504" border="0" /></a>  <br />(10)「Blogger」の「ビデオを追加」よりこのムービーを挿入します。 <br /><a href="http://lh3.google.com/nekonomie/R1uTTyGcqII/AAAAAAAACOo/5yNU17GgMdY/image%5B42%5D"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="368" alt="image" src="http://lh3.google.com/nekonomie/R1uTUyGcqJI/AAAAAAAACOw/uI81V5t6aYA/image_thumb%5B20%5D" width="504" border="0" /></a></p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-67802079774410508872009-05-21T06:59:00.001+09:002009-05-21T06:59:19.463+09:00Bloggerテンプレートでページ幅を変更するには パート3<p>今回のテンプレートは作成者:Todd Domineyのもので、やって見ます。 <br />オリジンルのページ幅は700pixですが、これを800pixにする場合は次のようにやります。 <br /><strong><font color="#0000ff">●widthの数値</font></strong><a href="http://lh6.ggpht.com/_MOvYiCUSqkI/ShR9MyFeaRI/AAAAAAAAJBg/0WWZW8Dbxxo/s1600-h/image%5B3%5D.png"><img title="image" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; margin: 0px 15px 0px 0px; border-right-width: 0px" height="268" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-bsjR50Fw4kZ4JNpvOHBpFjv0cVWVIQUTty5yufDwHtIXmDaCJ2fNbJWAXwaAFTs2Tq3XkYdmqWKoAHa3HwpXgNYH00eijqneKpax9Z9bFhNwQeCUeabd_dta_kcLvRPwxFzg/?imgmax=800" width="256" align="right" border="0" /></a> <br />#outer-wrapper { <br />    background-color:#473624; <br />    border-$startSide:1px solid #332A24; <br />    border-$endSide:1px solid #332A24; <br />    width:<font color="#ff0000">800</font>px; <br />    margin:0px auto; <br />    padding:8px; <br />    text-align:center; <br />    font: $bodyFont; <br />}</p> <p>#main-top { <br />    width:<font color="#ff0000">800</font>px; <br />    height:49px; <br />    background:#FFF3DB url("http://www2.blogblog.com/scribe/bg_paper_top.jpg") no-repeat top $startSide; <br />    margin:0px; <br />    padding:0px; <br />    display:block; <br />} <br /> <br /></p> <p>#main-bot { <br />    width:<font color="#ff0000">800</font>px; <br />    height:81px; <br />    background:#FFF3DB url("http://www.blogblog.com/scribe/bg_paper_bot.jpg") no-repeat top $startSide; <br />    margin:0; <br />        padding:0; <br />    display:block; <br />} <br /> <br />#wrap2 { <br />    width:<font color="#ff0000">800</font>px; <br />    background:#FFF3DB url("http://www1.blogblog.com/scribe/bg_paper_mid.jpg") repeat-y; <br />    margin-top: -14px; <br />    margin-$endSide: 0px; <br />    margin-bottom: 0px; <br />    margin-$startSide: 0px; <br />    text-align:$startSide; <br />    display:block; <br />} <br /></p> <p>#main {    <br />    <font color="#ff0000">width:530px; <br /></font>    float:$endSide; <br />    padding:8px 0; <br />    margin:0; <br />  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ <br />  overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */ <br />} <br /> <br /><font color="#0000ff"><strong>●backgroundの画像 <br /></strong></font>赤字の画像は横幅が700pixになっているので800pixに変更しますが、その方法は<a href="http://copype.blogspot.com/2008/10/blogger.html">Bloggerテンプレートでページ幅を変更するには</a>を参考にしてください。 <br />#main-top { <br />    width:700px; <br />    height:49px; <br />    background:#FFF3DB url("<font color="#ff0000">http://www2.blogblog.com/scribe/bg_paper_top.jpg</font>") no-repeat top $startSide; <br />    margin:0px; <br />        padding:0px; <br />    display:block; <br />} <br /> <br />#main-bot { <br />    width:700px; <br />    height:81px; <br />    background:#FFF3DB url("<font color="#ff0000">http://www.blogblog.com/scribe/bg_paper_bot.jpg</font>") no-repeat top $startSide; <br />    margin:0; <br />        padding:0; <br />    display:block; <br />} <br /> <br />#wrap2 { <br />    width:700px; <br />    background:#FFF3DB url("<font color="#ff0000">http://www1.blogblog.com/scribe/bg_paper_mid.jpg</font>") repeat-y; <br />    margin-top: -14px; <br />    margin-$endSide: 0px; <br />    margin-bottom: 0px; <br />    margin-$startSide: 0px; <br />    text-align:$startSide; <br />    display:block; <br />} <br /> <br />#footer { <br />    clear:both; <br />    background:url("<font color="#ff0000">http://www.blogblog.com/scribe/divider.gif</font>") no-repeat top $startSide; <br />    padding-top:10px; <br />    _padding-top:6px; /* IE Windows target */ <br />} <br /> <br />#header { <br />  background:url("<font color="#ff0000">http://www.blogblog.com/scribe/divider.gif</font>") no-repeat bottom $startSide; <br />} <br /> <br /><font color="#0000ff">●参考</font> <br />・<a href="http://webrogu.blogspot.com/">ページ幅800pixのレイアウトサンプル</a> <br />・ページ左右のマージン <br />#wrap3 { <br />    padding:0 <font color="#ff0000">50</font>px; <br />} <br />・bg_paper_top.jpgをbg_paper_top800px.jpgに変更し、<a href="http://sites.google.com/" target="_blank">Google Site</a>にアップロードした時のurl(ファイル名に800pxを入れたのは同時に900pixを作成したので、その区別のため) <br />#main-top {  <br />width:800px;  <br />  height:49px;  <br />  background:#FFF3DB url("<font color="#0000ff">http://sites.google.com/site/aurunetto/Home/bg_paper_top800px.jpg</font>") no-repeat top $startSide;  <br />  margin:0px;  <br />  padding:0px;  <br />  display:block; <br />} </p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-74597902067845298892009-04-27T17:08:00.000+09:002009-04-27T17:28:25.074+09:00Bloggerでスライドショー<p>Bloggerの中にスライドショーを挿入するにはPicasaウェブを利用するのが簡単です。Picasa2の時代にはPicasaウェブの言語設定をEnglishにしなければなりませんでしたが、Picasa3より日本語でもそれが可能になりました。 <br />この記事はPicasa2時代のものにPicasa3を追加する形で書きました。</p> <p align="left">(1)Picasa2でスライドショーに使う画像をトレイに入れる <br /><a href="http://lh6.ggpht.com/nekonomie/SMHFL86xBfI/AAAAAAAAErk/Q6hWJf1eZHM/s1600-h/image%5B2%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="122" alt="image" src="http://lh4.ggpht.com/nekonomie/SMHFMbTxQNI/AAAAAAAAEro/acKcfdh7jJc/image_thumb.png?imgmax=800" width="500" border="0" /></a> <br /><font color="#ff0000">Picasa3は下図</font> <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoU0e2nST81twY7w54jwyLYa_r-R_vazP9LgxBZEREskORQ7r7OH86MBQCHGYYWv1Q_Kl-qrkqWLaiTcTfHDkyZasKCoTRxbpAtwNQgIsOSNt7EeLB8USn3BacWYvIO8X6eeKB/s1600-h/image%5B19%5D.png"><img title="image" style="border-right: 0px; border-top: 0px; display: inline; border-left: 0px; border-bottom: 0px" height="89" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOkUXfoP1pFFL4q0sw4M6XRCOO3raVuCh3p1Prl2rYD8MwGhg3WqzXbWHFqkWL1DZfDHoJ-5aKp-9-K98Rjia1M8y7H2tTgod4_3yalsYR0QE-ThnT0Bl6I1t16suR3Sn70V-f/?imgmax=800" width="450" border="0" /></a> <br />(2)「ウェブアルバム」をクリック <br /><a href="http://lh4.ggpht.com/nekonomie/SMHFNOAG7YI/AAAAAAAAErs/NBNc8GvLM54/s1600-h/image%5B5%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="120" alt="image" src="http://lh3.ggpht.com/nekonomie/SMHFNp9LeHI/AAAAAAAAErw/haHvcUBFGQQ/image_thumb%5B1%5D.png?imgmax=800" width="504" border="0" /></a> <br /><font color="#ff0000">Picasa3は「アップロード」</font> <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_jNaaN1vEEY03E9i0UAv9aHmLIw5FOOr9BHsTaSakoBUi7APAjXLwtzRJg_pkrp9RGPKH4kmfPRaSZ_nz9xjyWIwl-nj1CjOOzqzOgVTlCCKIT1uhsYortwRS0Yl6eCibU160/s1600-h/image%5B3%5D.png"><img title="image" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="90" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnG6fw5ZToYsur_bqdXA3UuWyVhyphenhyphenepwx-f30uuWRXp96y4BsroRdsRsrwbm3xdu16wVzITqocbGzULEM36O9bUrqYcO7bNt-jpGWegW4my5GyevAWcdZlSDykSS4FVXRQvJ-7e/?imgmax=800" width="404" border="0" /></a> <br />(3)「アルバムタイトル」などを設定 <br /><a href="http://lh6.ggpht.com/nekonomie/SMHFOSg3AhI/AAAAAAAAEr0/wPgMztmjLoI/s1600-h/image%5B8%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="534" alt="image" src="http://lh3.ggpht.com/nekonomie/SMHFPdM4BpI/AAAAAAAAEr8/Du6O1fne3RM/image_thumb%5B2%5D.png?imgmax=800" width="497" border="0" /></a> <br /><font color="#ff0000">Picasa3は下図 <br /></font><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBw_incMH1p9pECii1JTQb-2pco7oOQmNUMmUJFfbmAViy8uQZ0X2oQYOq2e5-dR8hDFx8Q9W6b1D3itjW9CqH89JkP8pQmsxzw33v-D_pzEwJS1AEyQ5JzWNfU156A3DXJWzf/s1600-h/image%5B6%5D.png"><img title="image" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="424" alt="image" src="http://lh6.ggpht.com/_MOvYiCUSqkI/SfVpBIgkjkI/AAAAAAAAI64/Zu4K4MurnM4/image_thumb%5B2%5D.png?imgmax=800" width="404" border="0" /></a> <br />(4)「OK」をクリック<font color="#ff0000">(Picasa3はアップロード)</font> <br /><a href="http://lh5.ggpht.com/nekonomie/SMHFP2j4TuI/AAAAAAAAEsA/py5q_AoYZGI/s1600-h/image%5B14%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="288" alt="image" src="http://lh6.ggpht.com/nekonomie/SMHFQrS64uI/AAAAAAAAEsE/xrGSy-k633Q/image_thumb%5B4%5D.png?imgmax=800" width="442" border="0" /></a> <br />(5)「オンライン表示」をクリック <br /><a href="http://lh4.ggpht.com/nekonomie/SMHFRCKeUiI/AAAAAAAAEsI/O4FbEXaT9dk/s1600-h/image%5B17%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="288" alt="image" src="http://lh5.ggpht.com/nekonomie/SMHFRlKdObI/AAAAAAAAEsM/VrWVQmMgSMc/image_thumb%5B5%5D.png?imgmax=800" width="442" border="0" /></a> <br /><font color="#ff0000">Picasa3は下図 <br /></font><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVMCph3mrW8RB-9An1wzrWK6JuJKRCVS38ktdOXLnzcq8K0Cg2DXvvQJLXFUXYC73_4DUlAkw-SIDddq8gSlonT5TaG4yowWFM-qhfb2RSXVyg6krK8KVx9nPqxhIQXxauHkaK/s1600-h/image%5B12%5D.png"><img title="image" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="268" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZoXbCY-m0X8ipOJkoyBSMq6pqY_MtDVfg8eSotsajUr282HvfSGhYZ0Sek-gMtkkzBLc5Q5fu68jizCiQ9Z_f5SsqurJUIssnBWe-BZDaRZnxV6YwpcuhzQpYqdbc617eOUiu/?imgmax=800" width="439" border="0" /></a> <br />(6)アップロード済みの画像一覧 <br /><a href="http://lh4.ggpht.com/nekonomie/SMHFShOkrGI/AAAAAAAAEsQ/qNqNWL2gpDA/s1600-h/image%5B20%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="196" alt="image" src="http://lh3.ggpht.com/nekonomie/SMHFTiYT8MI/AAAAAAAAEsU/c4dEo19nV0k/image_thumb%5B6%5D.png?imgmax=800" width="504" border="0" /></a>  <br />(7)「このアルバムにリンク/Embed Slideshow」をクリック <br /><a href="http://lh5.ggpht.com/_MOvYiCUSqkI/SfVspra1mzI/AAAAAAAAI7c/N9xc_27Kowk/s1600-h/image%5B22%5D.png"><img title="image" style="border-right: 0px; border-top: 0px; display: inline; border-left: 0px; border-bottom: 0px" height="188" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHTyKsIf8DzvgIKjWylLVJqhB9sI0z3FME1P9E1lqjWbv3lANLMJNH_e0Y8og9BhNFT4vtNn0gD3rUwLcHbfZKJP_OJvt-B3zbu4SxTF-UWw13pTBC8WyGEt5TbNt8pb1bBmmp/?imgmax=800" width="262" border="0" /></a>   <br />(8)設定画面がポップアップして来るので表示サイズ(144px、288px、400px、600px、800px)と、説明の表示/非表示の選択とコードのコピー<font color="#ff0000"> <br /></font><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmtu0Eglx_1ypqDoDmgC7p2YT4Rnl0OMs93jqCK3Kf76n8qKl0Fo-3HPgBWTHN2qBFAuo1lI96D3AtjV3RTCupr6nWRlldq98TXsw-NglMUtjI92knCNlTZTdxCgGxT2ryq2HI/s1600-h/image%5B15%5D.png"><img title="image" style="border-top-width: 0px; display: inline; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="205" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiYiM0VjQaG7V_MUbQBjkc5KQdPqGrME4bnVHBHu04l3X0Sp3mx2TEabbOf5mFm3Ji6po0Wy_bZKfgILX1sghFFeUPJV8aXQJqOkmSwiQRFUtnxdYD1EZJ6bmWuybyrXSS4hVE/?imgmax=800" width="404" border="0" /></a> <br />(9)「完了」ボタンを押して、設定画面を閉じる <br />(10)Live Writerで「表示/HTMLコード」にし、貼り付ける (Bloogerで作業する時も同様) <br /><a href="http://lh4.ggpht.com/nekonomie/SMHFbp4kGNI/AAAAAAAAEtQ/TAfDLTHSYcI/s1600-h/image%5B44%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="157" alt="image" src="http://lh3.ggpht.com/nekonomie/SMHFcdyUDaI/AAAAAAAAEtU/VfzUcCyxZMw/image_thumb%5B14%5D.png?imgmax=800" width="484" border="0" /></a> <br />上記の方法で作成したスライドショー (札幌市南区藤野の「エルクの森」) <br /><embed pluginspage="http://www.macromedia.com/go/getflashplayer" src="http://picasaweb.google.co.jp/s/c/bin/slideshow.swf" width="400" height="267" type="application/x-shockwave-flash" flashvars="host=picasaweb.google.co.jp&RGB=0x000000&feed=http%3A%2F%2Fpicasaweb.google.co.jp%2Fdata%2Ffeed%2Fapi%2Fuser%2Fnekonomie%2Falbumid%2F5242671015543611937%3Fkind%3Dphoto%26alt%3Drss%26authkey%3D59hmKm0WkqA"></embed> </p> <p>※2008/9/4撮影、Canon Power Shot A700 <br />※背景色の変更 <br />スライドショーの背景色は、コード中のRGB=0x<strong><span style="color: #0000ff">000000</span></strong>の部分で変更できます。 <br />※スライドショーのメニュー:左から順に「ギャラリーへのリンク」、「キャプションの表示・非表示」、「戻る」・「再生/停止」・「進む」、「アルバム情報」 <br /> <br />●エルクの森 (航空写真中心点はカフェ&レストラン「ヴィーニュ」) <br /><iframe marginwidth="0" src="http://map.yahoo.co.jp/embedmap?lat=42.94509657&lon=141.31476355&sc=3&mode=aero&pointer=on&s=1220694891519884938e138bd5e0fa6a5e06b0d99e" frameborder="0" width="480" scrolling="no" height="360"></iframe> <br /><a href="http://map.yahoo.co.jp/pl?lat=42.94509657&lon=141.31476355&sc=3&mode=aero&pointer=on" target="ymap">詳しい地図で見る</a></p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-70662280591359879642009-04-24T05:59:00.000+09:002009-04-24T06:05:59.121+09:00Bloggerの投稿画面サイズを大きくする方法<p>Bloggerの投稿作成画面は700 X 250と小さいので、使いにくいです。これを広げてくれるのが、「Blogger Extended Editing」。 <br />この「Blogger Extended Editing」はアドオンの「Stylish」を入れてから行なうと簡単に済みます。 <br />但し、これはFirefoxの拡張機能なのでIEには適用されません。 <br />(1)Firefoxの起動後、「ツール/アドオン」で「stylish」を入れて検索、「Stylish」が表示されたら「Firefoxに追加」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFsGkW0bGn3zHP2pAQcNBCM5rxk4sxy-oFDKKHt4NLgOWYgcd089DM2jk2T2nk5i1KlsfCx4pTNqtUao9eF95GlHdZ6Ip7TMFwYD9UIQdlA3Fq-Fv0GQfcHlPU6d1WGEqaLgP6/s1600-h/image%5B33%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px 10px; border-right-width: 0px" height="221" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDrOfQfqOA50DJSjddK__Yqil2nxC58GIYzBpOwx5_jgCclAadjXrF7mzOfQ_lIDdho3PakGnvEvnjfVZ9cUfgEo6FfWkkpWFGnwaYYWy-xbhozQ1luVn9tfIdNeNQOqOswZdG/?imgmax=800" width="524" border="0" /></a> <br />(2)「今すぐインストール」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCUF8dbBt_P2iJHFMlyTmZKBji89lWncsuo-MlPAU1W7iq0egu-BLOGVoovjSn7hfNPVmZrOEpD5OWXG4J_KRm3zcsot9DvizU9roTxrCIXwptQe7d4Ch7CFERzrhoBbAfdKQn/s1600-h/image%5B34%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px 10px; border-right-width: 0px" height="352" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQ8wXuihowfVIP5HKamdg7DwE3YohXaWdkjjGkqF8l_2yjy0UmrXLmUI1eafJnwd-QDiorK2AtmmkpizZBPgzVKBdWksY-C_Nrkb5LdYHIs1ABrktKcHmKi526RwwSZ9O6x5SO/?imgmax=800" width="524" border="0" /></a> <br />(3)「Firefoxを再起動」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQ_vBuW6A9Zo-B79id-_806d-ik-jgjElnkBI3-Qzh0PMsSZootsqvoZaOuFGYxv7zeeBA6G_IN0zE7u_QNgzI_RXgwLnFHb3JBrM7-R94MwqDkbK2fyAANcfYWXcYrNXuQ1VX/s1600-h/image%5B35%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px 10px; border-right-width: 0px" height="246" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguIY0FopNuja5LtFwu7VD9iLTJFee-q-tKNIa75I4MQonJJaPDILrIEdwOl_DaV_5YiTaTqmOCI_II3tEEZ2kSzc1aOcBx4uiK72G_K8k6EWmUjcBZouP4zHCSU-K7gGyeRlt6/?imgmax=800" width="524" border="0" /></a> <br />(4)「閉じる」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipbx4j_gJ_PTncDCxvUJQL2RkqmNoLJLOfPUqLM0o-gqCDZ2RbXHIo22SLe6zeCkNPcILJtyIHLdT_0R0Jba3uCuzbJnFXxqJBdoVrdqo4DTGtCLV7ytnS0CtCjLD7ALdNqtm5/s1600-h/image%5B36%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px 10px; border-right-width: 0px" height="135" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIopKl4WHUUBRLBp3iH7p-uIojqVji6-wb96qs2sH45CFYo8E3r9Y_HiIxepm16EOn7dxx5rZgELQ3iAUsV1OZW_S9giGf1FxAe-ZXe9iptF1FVBfqc1POcKMTjfo9w0Wt3KXU/?imgmax=800" width="524" border="0" /></a> <br />(5)「<a href="http://userstyles.org/styles/4888" target="_blank">Blogger Extended Editing</a>」にアクセスし、「Load Into Stylish」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBS_f2MNd_PHjcvPEd9GG6GD-2CRsgWDMwAStg5fYCZjqaCbzkjPtAFspt8lxRdoRHvQ-ncaWQ40kdLhO7X84X7TCFVahP_Zpp9GHvA7NJQ7q9cl7MFgJh5PRudIG4El_sTjS7/s1600-h/image%5B37%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="62" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_kKTvSt5lfnTNfvW6z_Hb3GXdAV44xDPni6bXlVNmJ6YYe78r7542prSS7SaC_DN_jEkngxrW9X_LxpdhU2bIOBzm5e93KsRg278wAnhMWsYqwFOJOpV6LOHgIvVPadYcHKSK/?imgmax=800" width="524" border="0" /></a> <br />(6)「保存」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4sjBiIZ2U3hH6PvrO1EDbdcJ1O0B12yR5LIXTUISQLAT4KgaQe-ozsyycTRYy5mq9sR4ymKWhhQcHO62KNT_7Y-UhLjXQch67zpQQnoAYaYgvRe0OLWyfH9HZS6KaGGMF0J2y/s1600-h/image%5B38%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px 10px; border-right-width: 0px" height="293" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqqqZb33NWNIwhKltxSK-7k23_8p_WUH2UP5Kr421FfOvXzahvYJNOOdWb4dtLoXuox2Y5G-8A5CVxFic2uNk6GiN_yixNBpXLRVRdzTfcz4s-m2mO4OR6KW7n_LSt5H09JNHo/?imgmax=800" width="524" border="0" /></a>  <br />(7)Blogger投稿画面の旧と新 <br />旧サイズ:700X250、新サイズ:920X445 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjW_MoR-7S6cF-eVs7kIkx3ZQwzjjaoWFMejTYukQs_B_AvlM0hCLfwxU4T-cbOhFEcd3XY8Zzbg41Z2-XRH48sbzdZvoERXYyuINz-KUyDH2eT0_7HWPccEzIUrJVUUxrNGy35/s1600-h/image%5B30%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 15px 0px 0px; border-right-width: 0px" height="371" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2cGbS3OwktZbxexIDZygge9XeYPt2WqFq-VwnG6NWuVtjQRwC3KjwQjKvCr2yeu_OOHLOzNJOgrkOAJNnDeerSuafV1Sr13ML45JbUkbnDyev7iV0-PzZ6cLhcfCCyGgIed3u/?imgmax=800" width="319" align="left" border="0" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPZ6vDlib6pmZDC4e1bWpPzF85TbN3sJSG_PB8qAjEFDU_OhVHshS-d-D5zKd2U5DiSsX3Hmrg5AOgV8g6DawTpc5SEtqmjPV-uihO23HNCfM47jdSY1_VvTgAWHklqk4DrrMl/s1600-h/image%5B31%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px 0px; border-right-width: 0px" height="504" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiA2GMpL5Vo7NXy-5VGGLiEIgFLpkQSKgupw7jrWSm2-CQqojhpS6osWNUYzCCz3j3zn1MAijCfv4ydzO6eqeMS4azOD4kIRTFkztJQsAJ9yKD6sNpND_lB42RoScwbqIj2l22j/?imgmax=800" width="182" align="left" border="0" /></a></p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-27748407616907073542009-02-06T06:36:00.001+09:002009-02-06T06:36:28.383+09:00Bloggerをホームページ風にするにはHTMLソースのコピペでやるのが一番簡単<p>別なブログに「<a href="http://blg-tpt.blogspot.com/2009/02/blogger.html">Bloggerのテンプレートを編集してシンプルなホームページ風にする方法</a>」を書きましたが、一番簡単な方法はここで使ったHTMLのソースをダウンロード、解凍したソースをコピー、新規に作成したブログ(テンプレートは任意)の「テンプレートを編集」に貼り付けてそっくり入れ替えるだけ。 そのとき、「ウィジットを削除しようとしています」に対して「確認して保存」でOK。 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkgYOHg48KYCueWNmwOwU_Zy6rRcL4FZrT1k3hwmgbZVSKrYMaFD869mHNQwodm_wvlqHVr2dXE0wd4dnRlppUi4M1TwDDou4S_tK7j3aafd5lt0uxcTvtukkV7-hyURjP_QnO/s1600-h/image%5B2%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px 10px; border-right-width: 0px" height="251" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjW4HNs3L3ITPftTj5i4Hki_mq9Qz2ozjW_ZCidn6mQkLzZKSHikdqtER9IcDekkhzI2KZ2Idt5PjGc8JXMNR2deymKr_0oXp1PlhEmFS2YiK-_PmFOMB2N80HLal9QRwux0Ma2/?imgmax=800" width="504" border="0" /></a> <br />そうすると次のレイアウトのものが出来上がります。 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6kf5m8YRNwVly3tSpGobFbAwCoPVCRobClH5j0SQuswDu_d6qnEUx-dhvZ8_42fFJPGiOtGTkcu9WeVLTdW_MbJmAEQctdLmoAVF6lwIQb6nOXxDCkX-QdB0ytDRl96mp1alj/s1600-h/image%5B5%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px 10px; border-right-width: 0px" height="190" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhe8HKMP_5JBq_WBfT2an70Y1BMY_fAnLD5Podm6YDL-ik8A2MD0VQdL10ur2MnvkMOLE0X2psQSgP8GOHCy8S2wp4tycGxVbOIhoM1WnZ1H4eZHiHuocAqc_-go2Y9XjN6ts1O/?imgmax=800" width="504" border="0" /></a> <br />あとはトップのFLASHを変更するだけで、ホームページ風のブログが出来上がります。ここで勉強しなければならないのはFLASHファイル(*.swf)のアップロード先。 <br />下記アドレスの部分が出来ればいいのですが、この方法は様々。 <br /><iframe frameborder='0' height='160' marginheight='0' marginwidth='0' scrolling='no' src='<a href="http://owlnet.vista.googlepages.com/menu5_5.htm'">http://owlnet.vista.googlepages.com/menu5_5.htm'</a> valign='middle' width='800'/> <br />ここではFLASH関連ファイルのアップロード先にGoogleのPage Creatorを利用していますが、Yahoo!のGeocitiesでもファイルをアップしてFLASHが表示できれば出来ちゃいます。 <br />関連ページ: <br />●<a href="http://copype.blogspot.com/2008/09/flashswfgoogle-page-creatorblogger.html">FLASH(*.swf)メニューをGoogle Page CreatorにアップしBloggerで表示</a> <br />●<a href="http://copype.blogspot.com/2008/09/bloggerflash.html">BloggerにFLASHブログメニューを挿入</a></p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-11421801840196005512008-11-13T09:48:00.001+09:002008-11-13T09:48:08.187+09:00BloggerとPhotoshop Expressでブログ作成<p>このコーナーはBloggerとLive Writerを使ったブログ作成がテーマですが、Live Writerの調子が何らかの原因で悪い時はBloggerとPhotoshop Expressで行なうのも一つの選択肢です。ここではBloggerと同様に画像をクリックしたとき別ページに大きな画像が表示される方法でやって見ます。 <br /> <br />(1)Photoshop Expressで画像サイズをWebsite(800X600)に <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi16gtWouiyl60RblrLPnaifpCisXvHbNivxMB9MzVCgskS_bNkOYbtenP5tw62vwLuuHhS7cW1eBVU4p7OszTdUA4tO0l0g05wlv3wBRswR17P1Y1JxxVfyQcAcEFwyVJQj8Js/s1600-h/image%5B2%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px 10px; border-top: 0px; border-right: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLdy9VKdIHOiafraOZhXPtHMmZO1DlcP6u6Qfn2sHVhPId7iEFaSR0cOIQrAoye0EIg3riCXRPB0X2juCeUM4NeVOOlfMxQFNdpzaLXfhuuzwwZne1g1wSIIxT2O78hDdTs5rG/?imgmax=800" width="504" height="76" /></a> <br />(2)DownloadでLINKをクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi30akbkzfVSRApR3eneOX3r01oBQpQdUFvyd6Q_etNf1qcQeB0BopLU2i_LYKfjq2DRedgqYSQVjMNI2UzJ0zTT8MYyRrZzhncsTxxcBaE_CP6JgByLkn1Zj0R8y1zJ3I_-LhC/s1600-h/image%5B14%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px 10px; border-top: 0px; border-right: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHWeevk9xIljnMCnxLmJTYaRR4Q8POhbjsqPcmBt_wTQmQMgsl8HaAYKKqCPKNKDKJawafMiMWrmn3LHrNt4jJncwdfk_tM6BBEfycof8D3XJvnFznIWpMI3IrR3f8el0zE2Cl/?imgmax=800" width="423" height="327" /></a> <br />(3)「HTMLの編集」画面で「ここ」と言う文字を入れ「リンクタグを挿入」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtXLAU5VuwcQKpXZc_DeEAWzKEhxCpEA3rNs6sdNYVAb31qsKM-UOb4cba3-XBlue5DwJP9pT8rV9u2zRh0bFUxwxfMvOXRM11iGUVE39PDTTbztUcril6pf7K1s3F_aS30gVK/s1600-h/image%5B5%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px 10px; border-top: 0px; border-right: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPhlYbsjUJgJCbk9O6JAcIevEwoQLH0Qd2tRJZnS5d4jWkqWUkryixegm9d0UabZS0tcImitXm4kR_vi6OkDGUF6KnlYwtFL9IWvzBaQ-62DwCTL-yhcIwq78ifxv58iJHmK_l/?imgmax=800" width="498" height="253" /></a> <br />(4)セキュリティ警告を解除(IE)したら、「貼り付け」をクリック <br /><a href="http://lh3.ggpht.com/_MOvYiCUSqkI/SRt5CwgASmI/AAAAAAAAHPY/VoPW1Q5FJV8/s1600-h/image%5B17%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px 10px; border-top: 0px; border-right: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbpdi0CioXPvyK_k-Fb1l-0DR2T3pBiuVgr0Myhh3W9LfLHYQ_YryVDFrmvGZ2b5dq-jIkJv83DChY-i_KOxcRrYyB_taIWCseBRsD5VKVcFJFMsryGxOWTw7F6BWthkyPljJL/?imgmax=800" width="504" height="313" /></a> <br />(5)Photoshop ExpressでEMBEDをクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGW_gs1W2Jr1dOJEg3aBQdm0UQXU8YrWxQ2Btu48PM8kddC2ketOqh76AYFSnXp8KLdTCVxDIbBp9Kokk-wE94A97j4Zqp9rCxlh39JjFMSFJxvtqyBww_7lfOFWv70yi74J14/s1600-h/image%5B20%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px 10px; border-top: 0px; border-right: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU2A07G-XXSMbyQ30TU1dKgiNZUtfTyFXtRT-5sa9vMXDNl1fjBtuiXnNlgFwFb7riu10BmZ3emE1U3Leq2hid6rf-n1Qk8RVL_VGUFr3E9BOi8ToY5Trmk0QNlahx5Er60qP_/?imgmax=800" width="431" height="357" /></a> <br />(6)「ここ」を選択し「貼り付け」をクリック <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEit6nKAY5dNZwIBPk3cAasWECuoaIU0xY9PZUTLwkAsTsF1St6zRuPSk7IMiL8Kl9j_b1sznvIO4UHh87LJIA9BBIWNSFPJhZNLDDjnjLhpr-0OseobWBxYWIj_340bkgfmBnQn/s1600-h/image%5B23%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px 10px; border-top: 0px; border-right: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8ncCZZ1n7fp8SNLP3uT54qVv2H8MBr2bsAJQxn8TWCq9A0b7XJkYMdPe7PB1x1lpszpsZWi4LlTPYoRUVYZT1Ve-9Bg-NQb6rWps53QD1kCgunYBiG5InwG1mvYVMIVebcz84/?imgmax=800" width="383" height="255" /></a> <br />(7)文字が画像に置き換わりました <br /><a href="http://lh4.ggpht.com/_MOvYiCUSqkI/SRt5JGuAmrI/AAAAAAAAHPw/ZqJW4EJm6dA/s1600-h/image%5B26%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 0px 0px 10px; border-top: 0px; border-right: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR9e2cpuCqPvzIB__6HMCNR3fRodktORNk2i_eY_d7MPmbaE4JF7nEEsymrAI49Pk0bDYRX20KKceOeQGnq6UfqJZwIJNdpmtbQKAiuNs0NxS0xNZ0PHpoQhEA53apH9szgPRD/?imgmax=800" width="504" height="154" /></a> <br />(8)画像サイズをwidth="400" height="300"に変更 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7tBe8ReB8FZeDuaOjNO0pZf34yHUXbtlHWrmC9eLMbpvKpM11LepRHRKK-waoQe9YtMeZU-TP5faMwnSMLZe9QfFODIduxlV-WbS0PPQzUIvrGVOCki2uzKabePWtT2sYIZIR/s1600-h/image%5B29%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 0px 0px 10px; border-top: 0px; border-right: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzQrLU7y_WRU-A4dHRMA-NUGome21wvGf-rzwINVR-d98fwmpv8aarYzbAYmmSx5UlBV6d64ZaTWhpvVUyUaY8OqFC5OcIA5K4H_BmRpgiQg_HthcgUXiUxWRuhQmn5bh0DAQ5/?imgmax=800" width="504" height="171" /></a> <br />(9)同様に2枚目の画像を挿入 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr8prWpI74RBLwBY6ypogG6tCKBpHTFACEgNmME8BlcgtdzM3YI63rXKe9hOuWK0mF_aJzP9eRA8BeRxvWGpVMSuQvanisKw7tclWDhsvznVicRSNQL9Hy415qQPTOa0uy4sns/s1600-h/image%5B32%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px 10px; border-top: 0px; border-right: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLIO7AdQkGESlJ-1c4ShXoFvYpO4CBQa9l7e2mhKzuo5TeQEg-NZ8RCbrfwdMdNOi54GhcfH7-gTx-iz_VLfzSTkvv9tA7QxsdtNpsxk2eNhRrJ15C0PjV-l314I-J20kTN4WN/?imgmax=800" width="504" height="232" /></a> <br />(10)画像追加と文字入力 <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRuAkF_U1D42l2n9ulvctyq3NHl4pS_sqzBxBOtmqmDkQRrB0xapipKulNcTK6LZgtRQ0ik9jRy0BpYwHh4SaGG8bYAlfVl33tz7d2AGevBK7zqkN4EB-D6V-cmGp6SlYKwumE/s1600-h/image%5B38%5D.png"><img style="border-bottom: 0px; border-left: 0px; margin: 5px 0px 10px; border-top: 0px; border-right: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIe4gj_P0q9pS1hQ6hpmbC850eoB2WJag2oV2HUBm4i2-qGOttTzj7R_KgrR29bGD20-tyUk1H1kCjqmr8_ypolbdvJT7vdZNHG7KPZ6BBa2vfuy2LfwjG-nI9gVh-IncjotzH/?imgmax=800" width="504" height="454" /></a>  <br />※関連ページ:この方法で作成したブログ「<a href="http://kitakaidoh.blogspot.com/2008/11/blog-post_13.html">はなますの丘公園</a>」 </p> Unknownnoreply@blogger.com2tag:blogger.com,1999:blog-37798435.post-75182025442173209782008-10-27T17:58:00.002+09:002008-12-05T21:01:59.779+09:00Bloggerテンプレートでページ幅を変更するには パート2<p>違うテンプレートでページ幅を変更してみました。方法は前と同じなので結果だけを示します。 <br />(1)作成者:Douglas Bowman、Rounders 4のテンプレート <br /><a href="http://lh4.ggpht.com/nekonomie/SQWCjFcazoI/AAAAAAAAHBs/JnLB_X2ijQE/s1600-h/image%5B3%5D.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh6.ggpht.com/nekonomie/SQWCkfDv8tI/AAAAAAAAHB0/kOQcw_pWHRE/image_thumb%5B1%5D.png?imgmax=800" width="504" height="236" /></a> <br />(2)ページ幅 <br />#outer-wrapper { width:<span style="color:#0000ff;">740px</span>; margin:0 auto; text-align:$startSide; font: $bodyFont; } <br />#outer-wrapper { width:<span style="color:#ff0000;">940px</span>; margin:0 auto; text-align:$startSide; font: $bodyFont; } <br /><a href="http://lh5.ggpht.com/nekonomie/SQWClIv_8ZI/AAAAAAAAHB4/uZOlINR9svw/s1600-h/image%5B9%5D.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh5.ggpht.com/nekonomie/SQWCl1uc7oI/AAAAAAAAHB8/9j2XANOpg9k/image_thumb%5B3%5D.png?imgmax=800" width="504" height="219" /></a> <br />(3)メイン部の幅 <br />#main-wrap1 { width:<span style="color:#0000ff;">485px</span>; float:$startSide; background:$mainBgColor <br />#main-wrap1 { width:<span style="color:#ff0000;">685px</span>; float:$startSide; background:$mainBgColor <br /> <a href="http://lh5.ggpht.com/nekonomie/SQWCm7EcM-I/AAAAAAAAHCA/8nk_GVuUOYU/s1600-h/image%5B12%5D.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh4.ggpht.com/nekonomie/SQWCnr4U6fI/AAAAAAAAHCE/k4TLWdbzf-o/image_thumb%5B4%5D.png?imgmax=800" width="504" height="217" /></a> <br />#main { background:url("") repeat-y $startSide; padding:0; width:<span style="color:#0000ff;">485px</span>; } <br />#main { background:url("") repeat-y $startSide; padding:0; width:<span style="color:#ff0000;">685px</span>; } <br /> <br />(4)Body部の幅 <br />body#layout #outer-wrapper { width: <span style="color:#0000ff;">730px</span>; } <br />body#layout #outer-wrapper { width: <span style="color:#ff0000;">930px</span>; } <br /><a href="http://lh3.ggpht.com/nekonomie/SQWCocuow5I/AAAAAAAAHCI/TmgG8m-5Pc4/s1600-h/image%5B15%5D.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh5.ggpht.com/nekonomie/SQWCpEc_M5I/AAAAAAAAHCM/O055kt5J_xA/image_thumb%5B5%5D.png?imgmax=800" width="504" height="217" /></a> <br />(5)ヘッダーの背景画像(この場合は単純にサイズ変更しただけ) <br />#header { background:url("<span style="color:#0000ff;">http://www1.blogblog.com/rounders4/bg_hdr_bot.jpg</span>") no-repeat $startSide bottom; padding:0 15px 8px; } <br />#header { background:url("<span style="color:#ff0000;">http://aurunetto.googlepages.com/bg_hdr_bot.jpg</span>") no-repeat $startSide bottom; padding:0 15px 8px; } <br /> <br />(6)ヘッダー部上コーナーキャップ画像 <br />#header-wrapper { background: #476 url("<span style="color:#0000ff;">http://www2.blogblog.com/rounders4/corners_cap_top.gif</span>") no-repeat $startSide top; <br />#header-wrapper { background: #476 url("<span style="color:#ff0000;">http://aurunetto.googlepages.com/corners_cap_top.gif</span>") no-repeat $startSide top; <br /> <br />(7)メイン部下コーナー画像 <br />#main-wrap1 { width:685px; float:$startSide; background:$mainBgColor url("<span style="color:#0000ff;">http://www1.blogblog.com/rounders4/corners_main_bot.gif</span>") no-repeat $startSide bottom; <br />#main-wrap1 { width:685px; float:$startSide; background:$mainBgColor url(<span style="color:#ff0000;"><span style="color:#ff0000;">http://aurunetto.googlepages.com</span>/corners_main_bot.gif</span>) no-repeat $startSide <a href="http://lh4.ggpht.com/nekonomie/SQWCqLv6jSI/AAAAAAAAHCQ/eSfU5wSZG9Q/s1600-h/image%5B24%5D.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh3.ggpht.com/nekonomie/SQWCrs8TmJI/AAAAAAAAHCU/1_qaE2IpzYk/image_thumb%5B8%5D.png?imgmax=800" width="504" height="214" /></a> <br />(8)メイン部上コーナー画像 <br />#main-wrap2 { float:$startSide; width:100%; background:url("<span style="color:#0000ff;">http://www1.blogblog.com/rounders4/corners_main_top.gif</span>") no-repeat $startSide top; padding:10px 0 0; } <br />#main-wrap2 { float:$startSide; width:100%; background:url("<span style="color:#ff0000;">http://aurunetto.googlepages.com/corners_main_top.gif</span>") no-repeat $startSide top; padding:10px 0 0; } <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg91IwnfNS8s_iVWuwdf6Xa5KwbaRwT6G9ye81XCoK8zw7sKjXPmaxLf-rCNJy9WP2tmoi_OQNEyVAKGNZzgU86QIqPRMcjw3Ea22U8wAdSmGvL1UmiSp-YJK92iwUX86TqJP-g/s1600-h/image%5B3%5D.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrELlXX9VLGt_q0GDdxC0MeIkMPR6lSLVm5u5dJ8LXh7hHHZwp38brEeJQGNmzSYcq6kxP-ZowY98UM4JLGN8458f0LX2E2YT7v4HR-TZJ35OoNwh-bYypGT0qWomjoLCnKTfo/?imgmax=800" width="504" height="213" /></a> <br />(9)メイン部投稿欄 <br />#main { background:url("http://www.blogblog.com/rounders4/rails_main.gif") repeat-y <br />#main { background:url("<span style="color:#ff0000;"><span style="color:#ff0000;">http://aurunetto.googlepages.com</span>/rails_main.gif</span>") repeat-y <br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcQOk2qAuby8FWGHlnb7uhX4cqvqu6XguYCmzO0qNdcFI9f_AF5zWHCvTP_gJgBpa9gyExO9ZBGYtNTBHiztxRBlUfrPCWiaUSB2flAbEQMynNL4dUIJkkzmQxNbSMOgX_KBvg/s1600-h/image%5B6%5D.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGTCeA3YodJULRP7XRe1vCiyP9_QiFe6XklqG9FhcevBfBIZ_9BUCcwsnH1lZ7OL6zQj2HSrfuBxbQzZ5YOF72mVRQ3hJvMFHMELofONp7xjrcAy7rE506Zw7deBbzVKJUxN70/?imgmax=800" width="504" height="234" /></a> <br />(10)フッターのコーナーキャップ上部画像 <br />#footer-wrap2 { background:#447766 url("<span style="color:#0000ff;">http://www2.blogblog.com/rounders4/corners_cap_top.gif</span>") no-repeat $startSide top; color:$titleTextColor; } <br />#footer-wrap2 { background:#447766 url("<span style="color:#ff0000;"><span style="color:#ff0000;">http://aurunetto.googlepages.com</span>/corners_cap_top.gif</span>") no-repeat $startSide top; color:$titleTextColor; } <br /> <br />(11)フッターのコーナーキャップ下部画像 <br />#footer { background:url("<span style="color:#0000ff;">http://www.blogblog.com/rounders4/corners_cap_bot.gif</span>") no-repeat $startSide bottom; padding:8px 15px; } <br />#footer { background:url("<span style="color:#ff0000;">http://aurunetto.googlepages.com/corners_cap_bot.gif</span>") no-repeat $startSide bottom; padding:8px 15px; } <br /><a href="http://lh5.ggpht.com/nekonomie/SQWCu2IczuI/AAAAAAAAHCk/RW34Iq5_vIg/s1600-h/image%5B33%5D.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh3.ggpht.com/nekonomie/SQWCvb4o0qI/AAAAAAAAHCo/O6_B2fAYKPM/image_thumb%5B11%5D.png?imgmax=800" width="504" height="212" /></a> <br />※変更したレイアウトは<a href="http://kenkocook.blogspot.com/">こちら</a>・・・ <br />※変更に使った画像のアップ先サーバーは<a href="http://pages.google.com/">Google Page Creator</a></p>Unknownnoreply@blogger.com4tag:blogger.com,1999:blog-37798435.post-13007134008554117022008-10-26T07:59:00.001+09:002008-10-26T07:59:37.291+09:00Bloggerテンプレートでページ幅を変更するには<p>Bloggerのテンプレートはページ幅が700pixちょっと今となっては狭いので、少し広くして見ました。この変更はCSSの数値を変えるだけでは済まなくJTrim等のグラフィックスソフトが必要となります。 <br />(1)改造に使ったテンプレート:作成者 Dan Rubin Thisway Rose <br /><a href="http://lh5.ggpht.com/nekonomie/SQOkfGAxY-I/AAAAAAAAG_s/Wgo9OXdEiSY/s1600-h/image9.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh6.ggpht.com/nekonomie/SQOkgYNFE-I/AAAAAAAAG_w/SJlBxW9HVAE/image_thumb3%5B1%5D.png?imgmax=800" width="504" height="240" /></a> <br />(2)標準テンプレートで作成した場合 <br /><a href="http://lh5.ggpht.com/nekonomie/SQOkgxmmkRI/AAAAAAAAG_0/afVMY73v-Zs/s1600-h/image10.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh3.ggpht.com/nekonomie/SQOkhkvVl1I/AAAAAAAAG_4/oLiayYRWdd4/image_thumb4%5B1%5D.png?imgmax=800" width="504" height="225" /></a> <br />(3)幅のサイズ変更 (ページ幅760→900、メイン幅483→623、サイドは同じ) <br />●body { margin: 0; text-align: center; min-width: <font color="#0000ff">760px</font>; background: #ce436e url(http://www.blogblog.com/thisaway_rose/bg_body.gif) repeat-x $startSide top; color: $textColor; font-size: small; } <br /><font color="#ff0000">→</font>body { margin: 0; text-align: center; min-width: <font color="#ff0000">900px</font>; background: #ce436e url(http://www.blogblog.com/thisaway_rose/bg_body.gif) repeat-x $startSide top; color: $textColor; font-size: small; } <br />●#outer-wrapper { margin: 0 auto; width: <font color="#0000ff">760px</font>; text-align: $startSide; font: $bodyFont; } <br /><font color="#ff0000">→ </font>#outer-wrapper { margin: 0 auto; width: <font color="#ff0000">900px</font>; text-align: $startSide; font: $bodyFont; } <br />●#content-wrapper { position: relative; width: <font color="#0000ff">760px</font>; background: #f7f0e9 url(http://www.blogblog.com/thisaway_rose/bg_main_wrapper.gif) repeat-y $startSide top; } <br /><font color="#ff0000">→</font> #content-wrapper { position: relative; width: <font color="#ff0000">900px</font>; background: #f7f0e9 url(http://www.blogblog.com/thisaway_rose/bg_main_wrapper.gif) repeat-y $startSide top; } <br />●#main-wrapper { display: inline; /* fixes a strange ie margin bug */ float: $startSide; margin-top: 0; margin-$endSide: 0; margin-bottom: 0; margin-$startSide: 3px; padding: 0; width: <font color="#0000ff">483px</font>; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ } <br /><font color="#ff0000">→</font> #main-wrapper { display: inline; /* fixes a strange ie margin bug */ float: $startSide; margin-top: 0; margin-$endSide: 0; margin-bottom: 0; margin-$startSide: 3px; padding: 0; width: <font color="#ff0000">623px</font>; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ } <br /> <br />(4)サイズ変更後 <br /><a href="http://lh5.ggpht.com/nekonomie/SQOki5HGO1I/AAAAAAAAG_8/59wFOoQuVts/s1600-h/image15.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh5.ggpht.com/nekonomie/SQOkj84mLgI/AAAAAAAAHAA/8up1zVqQBgI/image_thumb7.png?imgmax=800" width="504" height="166" /></a>  <br />(5)ヘッダー下部画像のURL取得 <br />#header-wrapper { padding-bottom: 15px; background: url(<font color="#0000ff">http://www.blogblog.com/thisaway_rose/bg_header_bottom.gif</font>) no-repeat $startSide bottom; } <br />(6)URLをブラウザのアドレスバーに貼り付け <br /><a href="http://lh4.ggpht.com/nekonomie/SQOkkm--2gI/AAAAAAAAHAE/U-rZRb8e_9k/s1600-h/image11.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh4.ggpht.com/nekonomie/SQOklCbQc8I/AAAAAAAAHAI/THYBNJd-Ha0/image_thumb5.png?imgmax=800" width="504" height="144" /></a> <br />(7)画像を保存してJtrimで読み込みサイズ確認 <br /> <a href="http://lh6.ggpht.com/nekonomie/SQOkl8b_IXI/AAAAAAAAHAM/xpYOV20BDmE/s1600-h/image21.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh6.ggpht.com/nekonomie/SQOkmXRd8yI/AAAAAAAAHAQ/JAOi4yHBJvA/image_thumb9.png?imgmax=800" width="454" height="164" /></a> <br />(8)右の余白を140 <br /> <a href="http://lh6.ggpht.com/nekonomie/SQOkm3o70FI/AAAAAAAAHAU/Kfchu02jXAk/s1600-h/image36.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh5.ggpht.com/nekonomie/SQOkncvQhJI/AAAAAAAAHAY/Z7LdGuvTVAg/image_thumb14.png?imgmax=800" width="428" height="349" /></a> <br />(9)画面表示を400%にし、範囲選択  <br /> <a href="http://lh4.ggpht.com/nekonomie/SQOkn5B1CEI/AAAAAAAAHAc/-Hwnh7HuaeM/s1600-h/image10%5B1%5D.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh4.ggpht.com/nekonomie/SQOkoyl9jeI/AAAAAAAAHAg/whiFSsmOhsM/image_thumb3.png?imgmax=800" width="504" height="122" /></a> <br />(10)ドラッグで右端を合わせたら「位置確定」  <br /><a href="http://lh6.ggpht.com/nekonomie/SQOkpYV9TqI/AAAAAAAAHAk/JEvO3Jyt35o/s1600-h/image11%5B1%5D.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh6.ggpht.com/nekonomie/SQOkp-yX7TI/AAAAAAAAHAo/kJJWp-y3EV0/image_thumb4.png?imgmax=800" width="504" height="280" /></a>   <br />(11)同名のファイル名で保存 <br /><a href="http://lh3.ggpht.com/nekonomie/SQOkqqdZdZI/AAAAAAAAHAs/WNMzjXs0UII/s1600-h/image401.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh6.ggpht.com/nekonomie/SQOkrP3CMVI/AAAAAAAAHAw/PqwNck5hxfw/image40_thumb.png?imgmax=800" width="504" height="143" /></a>  <br />(12)サーバーにアップロード(有料・無料のレンタルサーバー) <br />(13)アップした画像のURLでテンプレート変更 <br />#header-wrapper { padding-bottom: 15px; background: url(http://<font color="#ff0000">www13.net/blogger/template</font>/bg_header_bottom.gif) no-repeat $startSide bottom; }  <br />(14)結果確認 <br /><a href="http://lh3.ggpht.com/nekonomie/SQOksV-ao_I/AAAAAAAAHA0/XndZdt9iCKg/s1600-h/image12%5B1%5D.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh5.ggpht.com/nekonomie/SQOktKWVN3I/AAAAAAAAHA4/CICGwxjOo0Y/image_thumb5%5B1%5D.png?imgmax=800" width="504" height="197" /></a> <br />(15)本文部の背景画像のURL取得 <br />#content-wrapper { position: relative; width: 900px; background: #f7f0e9 url(<font color="#0000ff">http://www.blogblog.com/thisaway_rose/bg_main_wrapper.gif</font>) repeat-y $startSide top; } <br />(16)URLをブラウザのアドレスバーに貼り付け <br /><a href="http://lh4.ggpht.com/nekonomie/SQOkt5-lpUI/AAAAAAAAHA8/FX2yBO8E-wk/s1600-h/image16.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh6.ggpht.com/nekonomie/SQOkuQvtm_I/AAAAAAAAHBA/yZdCfxCeHh8/image_thumb7%5B1%5D.png?imgmax=800" width="504" height="133" /></a>  <br />(17)画像を保存してJtrimで読み込み、余白作成(右140pix) <br />(18)画像途中にある区切り線を確認 <br /><a href="http://lh5.ggpht.com/nekonomie/SQOkvPpNlKI/AAAAAAAAHBE/XOYbmsRYX-g/s1600-h/image19.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh6.ggpht.com/nekonomie/SQOkv4urtRI/AAAAAAAAHBI/zV1DzLreTa0/image_thumb8.png?imgmax=800" width="439" height="134" /></a> <br />(19)区切り線のある位置より、かなり前の方からオリジナル画像(760pixの位置)の最後まで選択したら画像右端(900pix)までドラッグし「位置確定」をクリック <br /><a href="http://lh4.ggpht.com/nekonomie/SQOkwZlj8UI/AAAAAAAAHBM/uMFlVP9Fvh4/s1600-h/image22.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh6.ggpht.com/nekonomie/SQOkxIHaXJI/AAAAAAAAHBQ/-zn7RCa5iDE/image_thumb9%5B1%5D.png?imgmax=800" width="454" height="199" /></a> <br />(20)同様に保存しアップロード <br />(21)テンプレートの変更 <br />#content-wrapper { position: relative; width: 900px; background: #f7f0e9 url(http://<font color="#ff0000">www13.net/blogger/template</font>/bg_main_wrapper.gif) repeat-y $startSide top; } <br />(22)結果の確認 <br /><a href="http://lh6.ggpht.com/nekonomie/SQOkx6PLffI/AAAAAAAAHBU/WW_TEpDi9NI/s1600-h/image26.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh4.ggpht.com/nekonomie/SQOkylRuUHI/AAAAAAAAHBY/ENnJKW9Kj9k/image_thumb11.png?imgmax=800" width="504" height="192" /></a> <br />(23)フッター部背景画像のURL取得 <br />#footer-wrapper { padding-top: 15px; background: url(<font color="#0000ff">http://www.blogblog.com/thisaway_rose/bg_footer_top.gif</font>) no-repeat $startSide top; clear: both; } <br />(24)同様の手順で画像を変更しサーバーにアップしたらテンプレート変更 <br />#footer-wrapper { padding-top: 15px; background: url(http://<font color="#ff0000">www13.net/blogger/template</font>/bg_footer_top.gif) no-repeat $startSide top; clear: both; } <br />(25)結果確認 <br /><a href="http://lh3.ggpht.com/nekonomie/SQOkzhNN1jI/AAAAAAAAHBc/WCsKRuJvnT4/s1600-h/image30.png"><img style="border-right-width: 0px; margin: 5px 0px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh5.ggpht.com/nekonomie/SQOk0Qp4wQI/AAAAAAAAHBg/AKu9C_ONe5E/image_thumb13.png?imgmax=800" width="504" height="193" /></a>  <br />※実際は<a href="http://kirarakaido.blogspot.com/">このようなレイアウト</a>になります。 <br />※JTrimでの加工ポイント <br />エッジのカーブがなだらかになるよう位置合わせを注意深く行なうこと。 <br /> <a href="http://lh6.ggpht.com/nekonomie/SQOk1CnGxlI/AAAAAAAAHBk/58Nh7sizjYU/s1600-h/image36%5B1%5D.png"><img style="border-right-width: 0px; margin: 5px 0px 10px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" border="0" alt="image" src="http://lh5.ggpht.com/nekonomie/SQOk1xVmHmI/AAAAAAAAHBo/T0NvzgPeFgg/image_thumb15.png?imgmax=800" width="330" height="258" /></a> <br />●関連ページ:<a href="http://graphics.www13.net/page11.htm">JTrimの使い方</a> <br />※他のテンプレートも同じ手法でやれますが、小さな画像が多い場合は画像の特定と変更にかなり時間がかかります。 <br />※無料で使えるお勧めサーバー:Google Page Creator、Yahoo!ジオシティーズ <br />●関連ページ: <br />・<a href="http://copype.blogspot.com/2008/09/flashswfgoogle-page-creatorblogger.html">FLASH(*.swf)メニューをGoogle Page CreatorにアップしBloggerで表示</a> <br />・<a href="http://copype.blogspot.com/2008/09/bloggerflash.html">BloggerにFLASHブログメニューを挿入</a></p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-29505013505821472782008-10-04T06:31:00.001+09:002008-10-04T07:02:24.503+09:00BloggerのHeaderに背景画像を挿入<p>BloggerのHeaderに背景画像を挿入する方法を「Picasa2の使い方」に例を取って説明します。 <br />(1)「尺取り君」を起動して「Picasa2の使い方」Header部の背景色とサイズを測定します。  <br /><a href="http://lh5.ggpht.com/nekonomie/SOaVUjUYlBI/AAAAAAAAE80/x1OfxkFWlEQ/s1600-h/image%5B47%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="94" alt="image" src="http://lh5.ggpht.com/nekonomie/SOaVVFiWSZI/AAAAAAAAE84/E9mIrKbv_GM/image_thumb%5B15%5D.png?imgmax=800" width="454" border="0" /></a> <a href="http://lh5.ggpht.com/nekonomie/SOaO9_lvTZI/AAAAAAAAE7A/6-P39Zkn8PI/s1600-h/image%5B8%5D.png"> <br /></a>この「尺取り君」よりサイズは横730pix、R,G,Bは51,85,119と読み取れます。 <br />同様に縦は135pixとなります。 <br />(2)Picasa2を起動して、ロゴマークが出たら「PrintScreen」のキーを押します。 <br /><a href="http://lh6.ggpht.com/nekonomie/SOaO-4-MGkI/AAAAAAAAE7I/atx9O03MnbE/s1600-h/image%5B2%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px 0px; border-right-width: 0px" height="268" alt="image" src="http://lh6.ggpht.com/nekonomie/SOaO_erS4sI/AAAAAAAAE7M/h3lxKrUKFnE/image_thumb.png?imgmax=800" width="454" border="0" /></a> <br />(3)JTrimに貼り付け後、ロゴマーク部分をトリミングしたら縦135にサイズ変更 <br /><a href="http://lh4.ggpht.com/nekonomie/SOaO_8JuKCI/AAAAAAAAE7Q/XVjXbCVCFJg/s1600-h/image%5B5%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="164" alt="image" src="http://lh3.ggpht.com/nekonomie/SOaPAd0zcWI/AAAAAAAAE7U/MparZ7w5_jc/image_thumb%5B1%5D.png?imgmax=800" width="454" border="0" /></a>  <br />(4)「編集/コピー」(クリップボードに一時保存) <br /><a href="http://lh5.ggpht.com/nekonomie/SOaPA0T_TuI/AAAAAAAAE7Y/lEUA9UCnFyg/s1600-h/image%5B20%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="363" alt="image" src="http://lh3.ggpht.com/nekonomie/SOaPBtnCcjI/AAAAAAAAE7c/xmQ5PjeLq7o/image_thumb%5B6%5D.png?imgmax=800" width="418" border="0" /></a> <br />(5)JTrimの「新規作成」より次の様に設定します。 <br /><a href="http://lh4.ggpht.com/nekonomie/SOaPB_jKeGI/AAAAAAAAE7g/I5tadyMMuPc/s1600-h/image%5B11%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="197" alt="image" src="http://lh4.ggpht.com/nekonomie/SOaPCfCgWKI/AAAAAAAAE7k/lra8gde7j7w/image_thumb%5B3%5D.png?imgmax=800" width="303" border="0" /></a>  <br />(6)JTrimの「塗りつぶし」を選択し、「塗りつぶし色」を赤51、緑85、青119にします。 <br /><a href="http://lh5.ggpht.com/nekonomie/SOaPC8xfOMI/AAAAAAAAE7o/Y07Qf4_gf6g/s1600-h/image%5B14%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="350" alt="image" src="http://lh6.ggpht.com/nekonomie/SOaPDpJNutI/AAAAAAAAE7s/KjScZFAbu2s/image_thumb%5B4%5D.png?imgmax=800" width="454" border="0" /></a> <br />(7)「塗りつぶし」で新規作成のキャンパスに色をつけます。 <br /><a href="http://lh6.ggpht.com/nekonomie/SOaPD0DoIWI/AAAAAAAAE7w/ZpljVGC5oCk/s1600-h/image%5B17%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="158" alt="image" src="http://lh3.ggpht.com/nekonomie/SOaPEflXiFI/AAAAAAAAE70/WcbqeV6Nduw/image_thumb%5B5%5D.png?imgmax=800" width="454" border="0" /></a> <br />(8)「編集/合成貼り付け」を選択、ドラッグで位置合わせをしたら「位置確定」をクリック <br /><a href="http://lh5.ggpht.com/nekonomie/SOaPE1_XyBI/AAAAAAAAE74/iMm_wjeqFK4/s1600-h/image%5B23%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="100" alt="image" src="http://lh5.ggpht.com/nekonomie/SOaPFZOl3sI/AAAAAAAAE78/emrmThP-SO8/image_thumb%5B7%5D.png?imgmax=800" width="454" border="0" /></a> <br />(9)ロゴマーク部分の色を背景色と同じくします。  <br /><a href="http://lh5.ggpht.com/nekonomie/SOaPF29H_aI/AAAAAAAAE8A/n_A1G0akM7g/s1600-h/image%5B41%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="105" alt="image" src="http://lh6.ggpht.com/nekonomie/SOaPGWpy19I/AAAAAAAAE8E/_AWv_p0Jp4s/image_thumb%5B13%5D.png?imgmax=800" width="454" border="0" /></a> <br />(10)完成した画像を適当なファイル名で保存 <br /><a href="http://lh5.ggpht.com/nekonomie/SOaPGwCXpWI/AAAAAAAAE8I/i1dhNnK0SHU/s1600-h/image%5B44%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="87" alt="image" src="http://lh5.ggpht.com/nekonomie/SOaPHE5KVYI/AAAAAAAAE8Q/_teOLh_kcVs/image_thumb%5B14%5D.png?imgmax=800" width="454" border="0" /></a> <br />(11)Bloggerのレイアウトで「Header」の「編集」をクリック <br /> <a href="http://lh5.ggpht.com/nekonomie/SOaPHk3QhiI/AAAAAAAAE8U/_5GZ9o32GBw/s1600-h/image%5B29%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="123" alt="image" src="http://lh4.ggpht.com/nekonomie/SOaPIIRF4jI/AAAAAAAAE8Y/Lua4f-VOQyo/image_thumb%5B9%5D.png?imgmax=800" width="454" border="0" /></a> <br />(12)「ページに合わせてサイズを調整」にチェックを入れ、ファイルを選択 <br /><a href="http://lh6.ggpht.com/nekonomie/SOaPIp4pRdI/AAAAAAAAE8c/v0Nv5yra5cc/s1600-h/image%5B32%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="477" alt="image" src="http://lh6.ggpht.com/nekonomie/SOaPJWWWaBI/AAAAAAAAE8g/K8sFuHQl1ic/image_thumb%5B10%5D.png?imgmax=800" width="454" border="0" /></a>  <br />注:画像の挿入時、余白部分が差し引かれるので、挿入した画像は実際のサイズより小さくなります。 <br /> <br />(13)挿入した画像と文字が重ならないようにするため、「設定/基本/説明」で改行の<br>を適当な位置に挿入します。 <br /><a href="http://lh3.ggpht.com/nekonomie/SOaPJjcuH7I/AAAAAAAAE8k/yKGGtwG2KEI/s1600-h/image%5B35%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="118" alt="image" src="http://lh5.ggpht.com/nekonomie/SOaPKPDedII/AAAAAAAAE8o/gtWyUAYTR2c/image_thumb%5B11%5D.png?imgmax=800" width="454" border="0" /></a> <br />(14)完成(IE7、モニターの画面解像度120dpiの時) <br /><a href="http://lh5.ggpht.com/nekonomie/SOaPKkV4oEI/AAAAAAAAE8s/7cfzOBE_mfk/s1600-h/image%5B38%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="114" alt="image" src="http://lh4.ggpht.com/nekonomie/SOaPLW6MVJI/AAAAAAAAE8w/0prDwbqYTts/image_thumb%5B12%5D.png?imgmax=800" width="454" border="0" /></a>  <br /><strong>※関連ページ</strong> <br />●<a href="http://owlnet.jp/pcdr/main/prtsc.htm">プリントスクリーンの使い方</a> <br />●<a href="http://graphics.www13.net/page11.htm">JTrimの使い方</a> <br />●<a href="http://free.www13.net/">アウルネットで使用中のフリーソフト</a>(「尺取り君」のダウンロード先) <br />●<a href="http://pikasa2.blogspot.com/">Picasa2の使い方</a></p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-50703135595074540322008-09-18T15:21:00.001+09:002008-09-30T11:21:38.588+09:00Live Writerへコピペした時の画像サイズ<p>Live Writerにコピペで挿入した画像の初期サイズ(最大値)を変更したい時は画像をクリックした時、サイドバーに表示される「画像のプロパティ」で設定します。 <br />(1)「詳細設定」内の「既定の画像サイズをカスタマナイズする」をクリック <br /><a href="http://lh4.ggpht.com/nekonomie/SNHzPspEtpI/AAAAAAAAEz8/T8b6RgQlj6Q/s1600-h/image30.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="391" alt="image" src="http://lh3.ggpht.com/nekonomie/SNHzQbDkh4I/AAAAAAAAE0A/r3osD5mhDVo/image_thumb24.png?imgmax=800" width="283" border="0" /></a> <br />(2)「小サイズ」の幅と高さの大きさを入力 <br />ここで設定した「小サイズ 幅の最大値 400ピクセル」とは、400pixより大きな画像を貼り付けたら400pixに自動縮小されると言う意味です。 <br />従って350pixの画像を貼り付けた場合は350pixになります。 <br />  <a href="http://lh5.ggpht.com/nekonomie/SNHzRBqPRQI/AAAAAAAAE0E/7ycAjs1VYSE/s1600-h/image40.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="371" alt="image" src="http://lh3.ggpht.com/nekonomie/SNHzR9q6_3I/AAAAAAAAE0I/1jU_wZcU-s4/image_thumb30.png?imgmax=800" width="330" border="0" /></a> <br />もし中サイズや大サイズをその意味とは別に小サイズより小さく設定した場合はここからより小さな画像にワンタッチで変更できますが、画像をクリックした時、別ウィンドウで表示される画像も小さくなってしまうと言う問題が出てしまいます。この時の画像サイズはどうも中サイズになるようなので、結局今は次のような設定にしています。 <br />  <a href="http://lh4.ggpht.com/nekonomie/SOGNL_B7E1I/AAAAAAAAE4o/uSnKQL_OP2I/s1600-h/image%5B5%5D.png"><img style="border-right: 0px; border-top: 0px; margin: 5px 0px; border-left: 0px; border-bottom: 0px" height="371" alt="image" src="http://lh6.ggpht.com/nekonomie/SOGNMcHbrtI/AAAAAAAAE4s/eVk1rUqMdrc/image_thumb%5B1%5D.png?imgmax=800" width="330" border="0" /></a> <br />これだとJTim等で800pix(又は640pix)にリサイズしてからLivw Writerに貼り付けると400pixに自動縮小され、その画像をブラウザでクリックした時は800pix(又は640pix)になります。 </p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-1377098453567722682008-09-18T10:28:00.001+09:002008-09-18T10:28:35.306+09:00FLASH(*.swf)メニューをGoogle Page CreatorにアップしBloggerで表示<p>Yahoo!ジオシティーズを利用してFLASHメニューをBloggerに挿入する方法は<a href="http://copype.blogspot.com/2008/09/bloggerflash.html">ここで紹介</a>しましたが、Google Page Creatorでも可能です。この方法は現在Yahoo!IDを持っていない人や将来それを取る予定の無い人に有効です。 <br />それには先ず<a href="http://pages.google.com/" target="_blank">Google Page Creator</a>にアクセスしGoogleアカウントでログインします。 <br />今の所、メニューは英語のみですが、Bloggerに慣れた人なら難しい事ではありません。 <br />ここでFLASH関連ファイルをアップするには「Site Manager」で「upload」をクリック <br /><a href="http://lh5.ggpht.com/nekonomie/SNGur7yk2pI/AAAAAAAAEzU/Omowd10kvqk/s1600-h/image%5B2%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="263" alt="image" src="http://lh4.ggpht.com/nekonomie/SNGuselxYoI/AAAAAAAAEzY/BgcA0OrHlMY/image_thumb.png?imgmax=800" width="454" border="0" /></a>  <br />「参照」をクリック <br /><a href="http://lh4.ggpht.com/nekonomie/SNGusxjrx_I/AAAAAAAAEzc/tMFNt1pqQW8/s1600-h/image%5B5%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="281" alt="image" src="http://lh5.ggpht.com/nekonomie/SNGutYjqzjI/AAAAAAAAEzg/oZobOQvw_Hw/image_thumb%5B1%5D.png?imgmax=800" width="454" border="0" /></a> <br />パソコン内のファイルを選択してアップロード <br /><a href="http://lh4.ggpht.com/nekonomie/SNGutwrDIvI/AAAAAAAAEzk/xFoDXGOl0HA/s1600-h/image%5B8%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="315" alt="image" src="http://lh5.ggpht.com/nekonomie/SNGuugAh0hI/AAAAAAAAEzo/eNQdzuwHvEY/image_thumb%5B2%5D.png?imgmax=800" width="454" border="0" /></a>  <br />動作確認は該当するhtmlファイルをクリック <br /><a href="http://lh5.ggpht.com/nekonomie/SNGuvLDDicI/AAAAAAAAEzs/yAhQO8aVt2s/s1600-h/image%5B11%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="258" alt="image" src="http://lh4.ggpht.com/nekonomie/SNGuvnYoq3I/AAAAAAAAEzw/jNzFsfXiaBM/image_thumb%5B3%5D.png?imgmax=800" width="454" border="0" /></a> <br />既定のブラウザで表示したら動作確認 <br /><a href="http://lh5.ggpht.com/nekonomie/SNGuwP43RxI/AAAAAAAAEz0/ldkORnLiGyk/s1600-h/image%5B14%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="344" alt="image" src="http://lh4.ggpht.com/nekonomie/SNGuwjR4aPI/AAAAAAAAEz4/L2fc5RmhtWw/image_thumb%5B4%5D.png?imgmax=800" width="187" border="0" /></a>  <br />このFLASHのアドレスは <br /><a href="http://aurunetto.googlepages.com/menu1.html">http://aurunetto.googlepages.com/menu1.html</a> <br />そして、このhtmlファイルをBlogger側の「ガジェット/HTML・JavaScript」で<iframe>として挿入するとFLASHメニューが出来上がります。 </p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-43416027381788307952008-09-18T06:50:00.000+09:002008-09-18T08:57:33.963+09:00YouTubeビデオの埋め込み<p>このビデオを再生するには画像をクリックしてから「再生ボタン」を押してください。 <br />Star Wars VS Sketchup II Speedway Attack SketchyPhysics <br /> <br /><embed src="http://www.youtube.com/v/MhN7oE-xxlE&rel=0&color1=0xd6d6d6&color2=0xf0f0f0&border=0" width="425" height="355" type="application/x-shockwave-flash" wmode="transparent" />  <br /> <br />YouTubeビデオをブログの中に挿入するには<a href="http://www.youtube.com/" target="_blank">YouTube</a>にアクセスし、埋め込みたいビデオを選択します。 <br />その後、「埋め込み」のタグをBloggerやLive Writerの「HTMLの編集(HTMLコード)」へコピペしてやります。 <br />ここで「埋め込みのカスタマナイズ」をクリックすると「関連する動画を含めるかどうか」や「境界線の表示をどうするか」のオプションが表示されますので必要に応じて選択します。 <br /><a href="http://lh6.google.com/nekonomie/R1zxHHa9MvI/AAAAAAAACT4/chi1JLBbDpE/image%5B3%5D"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="422" alt="image" src="http://lh5.google.com/nekonomie/R1zxH3a9MwI/AAAAAAAACUA/tdBkb4L2kg8/image_thumb%5B1%5D" width="383" border="0" /></a>  <br />もしムービーのサイズを変更したい時ははwidth,heightの値を同一比率で変えてやります。</p> <p>音量調整は下図のアイコンから可能 <br /><a href="http://lh6.ggpht.com/nekonomie/SNF9Kpk6O5I/AAAAAAAAEzE/Avnqxhgw5Xo/s1600-h/image%5B9%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="342" alt="image" src="http://lh3.ggpht.com/nekonomie/SNF9LgP7qiI/AAAAAAAAEzI/HyuuPOByeZI/image_thumb%5B4%5D.png?imgmax=800" width="383" border="0" /></a>  <br /> <br /><embed>タグやurl の取得は下図のアイコンから可能 <br /><a href="http://lh6.ggpht.com/nekonomie/SNF9MfinPqI/AAAAAAAAEzM/R9OwXUk0BHA/s1600-h/image%5B10%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="322" alt="image" src="http://lh3.ggpht.com/nekonomie/SNF9N1zOcgI/AAAAAAAAEzQ/Yj4FzozVHNM/image_thumb%5B5%5D.png?imgmax=800" width="386" border="0" /></a> <br />もしYouTube埋め込みのとき関連動画を含めた場合は空いている部分にそのタイトルが表示されます。 <br /> <br /><strong>関連ページ</strong> <br />●<a href="http://drawup.blogspot.com/2007/11/sketchup.html">SketchUpでドミノ倒し</a></p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-74620413844652156612008-09-13T17:43:00.000+09:002014-12-27T16:42:20.763+09:00登録不要のアクセスカウンターをBloggerに設置<span style="color: red;">※最近、カウンターが表示さなれなくなったので、サービスを止めたのかも知れません。</span><br />
<span style="color: red;">一時的なのかどうか不明ですので、この記事は一応残しておきます。(2014/12/27)</span><br />
<br />
オンラインアクセスカウンター設置サービスを使うとブログにカウンターを付けることができます。ここで紹介するのは<a href="http://cnt.itgear.jp/image.html" target="_blank">無登録で直ぐ使えてしまうサイト</a>のものです。 <br />このページを一通り読んだら、「メニュー/カウンタ画像一覧」をクリック、カウンターのデザイン424種類の内から一つを選択します。 <br />前ページの「カウンタタグ生成フォーム」に必要事項を入力したら、「タグ生成」をクリックします。 <br /><a href="http://lh4.google.com/nekonomie/R2Bb7na9NaI/AAAAAAAACZ8/ucGve6bJ7Kk/image%5B4%5D"><img alt="image" border="0" src="http://lh4.google.com/nekonomie/R2Bb8na9NbI/AAAAAAAACaE/ZVZpYAg8QXo/image_thumb%5B2%5D" height="500" style="border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px;" width="504" /></a> <br /><script > ~ </script>までのタグを選択しコピー <br />カウンターを挿入するBloggerの「マイレポート」で「レイアウト」をクリック、次に「ページ要素を追加して並べ替え」画面で「ガジェットを追加」をクリック、ここで「HTML/JavaScript」をクリック <br /> <a href="http://lh3.ggpht.com/nekonomie/SMt92ToWLXI/AAAAAAAAEx0/k8JXGNnOPQQ/s1600-h/image%5B3%5D.png"><img alt="image" border="0" src="http://lh6.ggpht.com/nekonomie/SMt93OVCrWI/AAAAAAAAEx4/_7VeUevHQUk/image_thumb%5B1%5D.png?imgmax=800" height="83" style="border-bottom: 0px; border-left: 0px; border-right: 0px; border-top: 0px; margin: 10px 0px;" width="504" /></a> <br />そしてコンテンツ内に先ほどコピーしたコードを貼り付けます。 <br /><a href="http://lh4.google.com/nekonomie/R2Bb-na9NeI/AAAAAAAACac/DqElGVI29uA/image%5B9%5D"><img alt="image" border="0" src="http://lh3.google.com/nekonomie/R2Bb_Xa9NfI/AAAAAAAACak/BPBAmYDtpQU/image_thumb%5B5%5D" height="460" style="border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; margin: 5px 0px;" width="504" /></a> <br />「変更を保存」をクリック <br />ブログを表示させ、カウンターが動作することを確認したら、次の様に<span style="color: red;">ITGCntCount=1;</span>を削除します。 <br /><a href="http://lh6.google.com/nekonomie/R2BcAHa9NgI/AAAAAAAACas/961L2upyrXk/image%5B13%5D"><img alt="image" border="0" src="http://lh5.google.com/nekonomie/R2BcA3a9NhI/AAAAAAAACa0/qQhz9YzLAaQ/image_thumb%5B7%5D" height="471" style="border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px;" width="504" /></a> <br />(ここではカウンターを中央揃いにする為<span style="color: blue;"><center></span>タグを入れました。 ) <br />この操作により、次にアクセスがあると1アップします。 <br /> <br />もし<span style="color: red;">最初からITGCntCount=1;を削除</span>して動作させると <br /><a href="http://lh6.google.com/nekonomie/R36V8XzquXI/AAAAAAAADGI/z1EdgBypgFw/image%5B3%5D"><img alt="image" border="0" src="http://lh6.google.com/nekonomie/R36V9XzquYI/AAAAAAAADGQ/00mle-CIjnM/image_thumb" height="87" style="border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; margin: 10px 0px;" width="278" /></a> <br />となりますが、<span style="color: blue;">F5(ブラウザの更新)</span>を押すと <br /> <br /><a href="http://lh5.google.com/nekonomie/R36V-HzquZI/AAAAAAAADGY/l9Qf6qmVBJ4/image%5B6%5D"><img alt="image" border="0" src="http://lh5.google.com/nekonomie/R36V_HzquaI/AAAAAAAADGg/hKaZL2LG34U/image_thumb%5B1%5D" height="109" style="border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px;" width="311" /></a> <br />初期値の1になります。 <br /> <br />このカウンターはアドレス毎に管理しているので、このカウンターを1個設置すれば投稿タイトル別のアクセス状況も分かります。 <br />私はこれまでCGIを使ってカウンターを設置していましたが、これ一つで済んでしまいます。 <br />唯一の心配はサービス停止ですが、可能な限り継続して欲しいと思います。<br />
<strong>登録不要で無料のカウンターサービスサイト</strong> <br />●<a href="http://cnt.itgear.jp/" target="_blank">ITギアアクセスカウンター</a><br />
※2008/9/13 内容追記と最新の画像に変更Unknownnoreply@blogger.com11tag:blogger.com,1999:blog-37798435.post-78780142258755333212008-09-12T08:11:00.000+09:002008-09-14T08:12:05.209+09:00FLASHの背景を透明にするには?<p>背景色の一般的説明(objectタグ内) <br /><PARAM NAME=wmode VALUE=window> <br />この設定はWindows版のInternet Explorer 4.0以上で機能し、次の3種類の指定ができます。但しEMBEDタグでは「wmode=window」のように記述します。 <br />「window」[標準]ページ上で専用の四角形の窓でムービーが表示されます。 <br />「opaque」[不透明表示]ムービーの背後にあるものはすべて表示されなくなります。 <br />「transparent」[透明表示]ページの背景がムービーの透明な部分を通して透けて見えるようになります。 <br />省略すると「window」を指定したことと同じになります。 </p> 従ってFLASHムービーの背景色を透明にするには <br /><PARAM NAME=wmode VALUE=transparent>、<embed wmode=transparent >とします。 Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-1211340226204843932008-09-12T07:49:00.000+09:002008-09-14T07:52:34.791+09:00スクロール文字と背景の透明<p>スクロール文字をBloggerに入れた時、気になるのはスクロール枠内の背景色。これを解決してくれるのが背景色の透明化なのですが、スクロール文字が入ったhtmlとBloggerに挿入する時のインラインフレームの両方を透明にしてやる必要があります。 <br /> <br />(1)マーキー(スクロール文字)のhtml <br /><body>タグに次のようなスタイルを設定します。 <br /><html> <br /><head> <br /><meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <br /><title></title> <br /></head> <br /><body <font color="#ff0000">style="background-color:transparent;"</font>> <br /><p><span style="font-size:21px;color:#3333ff;"><marquee width="400" height="30"> <br />北海道の開花情報にようこそ。このブログへの投稿は承認を得た人だけ、コメントの投稿はGoogleアカウントを持っているだけができます。</marquee></span> <br /></p> <br /></body> <br /></html> <br /> <br />(2)Bloggerのインラインフレーム例 <br />マーキーが入ったhtmlファイルをBloggerに挿入すには<iframe>を使用しますが、その時マーキーの背景色が白くなってブログの背景色と合わない場合があります。そんな時は<iframe>で背景を透明にします <br /><iframe frameborder="0" marginheight="0" marginwidth="0" height="40" src="<a href="http://www13.net/blogger/marque.html"">http://www13.net/blogger/marque.html"</a> scrolling="no" width="240" <font color="#ff0000">allowtransparency="true"</font>></iframe> <br /> <br />これだと、IEは文字色、文字サイズもOK、FireFoxだとスクロール文字だけがOKでした。 <br />この方法で入れて見たのが「<a href="http://kaikajoho.blogspot.com/" target="_blank">北海道の開花情報</a>」です。 <br /> <br />※関連サイト: <br />●<a href="http://www.tagindex.com/tool/marquee.html" target="_blank">スクロール文字(マーキー)作成ツール</a> <br />●<a href="http://www.tagindex.com/tool/iframe.html" target="_blank">インラインフレーム作成ツール</a></p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-66538772171090368722008-09-12T06:35:00.000+09:002008-09-14T06:35:55.450+09:00Googleマップ吹き出しでのスタイル<p>地図上のアイコンをクリックした時、説明文や画像がでますが、1行毎に改行を入れないで作成すると枠幅が最大で500pixになります。これをもっと小さな幅にしたい時はスタイルで幅を指定してやります。 <br />(例) 画像のサイズが横200pixなので文字幅も200pixにしたい <br /><div style="width: 200px; padding-right: 10px;">ここに文書を入れる</div> <br />padding-right 文字と枠の右側余白 <br />padding-left 文字と枠の左側余白 <br />padding-top 文字と枠の上側余白 <br />padding-bottom 文字と枠の下側余白 </p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-77276347618414218402008-09-10T10:00:00.005+09:002009-02-06T06:05:30.421+09:00BloggerにFLASHブログメニューを挿入<p>BloggerはFLASHに対応していないので、FLASHをBloggerに挿入しようと思ったら、FLASHファイル(*.swf)を別サーバーにおく必要があります。ここではYahoo!ジオシティーズを利用してFLASHで作成されたブログメニューを設置して見ます。</p> <p><span style="color: #0000ff"><strong>(1)メニューに使うFLASHファイルの準備</strong></span> <br />今回はGoogle検索で「FLASH 素材」とした時、トップのものを使用して見ました。 <br />(a)<a title="http://satisfydesire.com/" href="http://satisfydesire.com/">http://satisfydesire.com/</a> で「FLASH Materials/横長メニュー」を選択</p> <p><a href="http://lh4.ggpht.com/nekonomie/SMcbp37hKdI/AAAAAAAAEuI/7NETEDg8Upk/s1600-h/image8.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="265" alt="image" src="http://lh6.ggpht.com/nekonomie/SMcbq4w7O5I/AAAAAAAAEuM/WMGCEufn4ho/image_thumb2.png?imgmax=800" width="452" border="0" /></a></p> <p>(b)素材の選択が終わったら「DOWNLOAD」をクリックしパソコンに保存</p> <p><a href="http://lh6.ggpht.com/nekonomie/SMcbr5fzwLI/AAAAAAAAEuQ/05jd8VCvTOs/s1600-h/image11.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="223" alt="image" src="http://lh6.ggpht.com/nekonomie/SMcbs-hrggI/AAAAAAAAEuU/e_FFyLEv9tY/image_thumb3.png?imgmax=800" width="504" border="0" /></a> </p> <p>(c)保存したファイルを適当なフォルダに解凍(4個のファイル) <br />Read Me.txt <br />sw_menu01.txt <br />sw_menu01_white.html <br />sw_menu01_white.swf <br /> <br />(d)解凍したフォルダ内にある設定ファイル(sw_menu01.txt)を実際に即して変更 <br />●&menu1~6:メニュータイトルを入力(英数字) <br />(日本語対応のものは別のタイプにあります。 ) <br />●&url1~6:リンク先のURLを絶対パスで入力 <br />●&target1~6:_top (同じウィンドウ内に表示)又は_blank(別ウィンドウに表示)に変更 <br />●&msg1~6:メニュータイトルの説明を入力</p> <p><a href="http://lh4.ggpht.com/nekonomie/SMcbthn2aII/AAAAAAAAEuY/Gt-SMi41VNQ/s1600-h/image17.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="534" alt="image" src="http://lh6.ggpht.com/nekonomie/SMcbulZEOQI/AAAAAAAAEuc/E15AKdLbT40/image_thumb5.png?imgmax=800" width="470" border="0" /></a> </p> <p><span style="color: #0000ff">※オリジナルのsw_menu01_white.htmlはファイル名が長いので、ここでは<span style="color: #ff0000">menu2.html</span>に変更しました。</span><span style="color: #0000ff"> <br /></span> <br />(e)htmlファイル<body>部の余白調整</p> <p>sw_menu01_white.html(menu2.html)のソースを表示し、<head>~</head>間に <br /><style type="text/css"> <br /><!-- <br />body { <br />margin: 0px; <br />} <br />--> <br /></style> <br />を入力。これで<body>部の余白が0になります。 <br /> <br />(f)設定が終わったらsw_menu01_white.html(menu2.html)をダブルクリックして動作確認</p> <p><span style="color: #0000ff"><strong>(2)Yahoo!ジオシティーズ</strong></span> <br />(a)<a href="http://geocities.yahoo.co.jp/" target="_blank">Yahoo!ジオシティーズ</a>にアクセスしたら、「カンタンにホームページが作れるジオクリエーター」をクリック</p> <p><a href="http://lh5.ggpht.com/nekonomie/SMcbxLepbqI/AAAAAAAAEuo/rcTy0xANt2Q/s1600-h/image3.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="65" alt="image" src="http://lh5.ggpht.com/nekonomie/SMcbx1oeJmI/AAAAAAAAEus/2Srua8PWEYE/image_thumb1%5B1%5D.png?imgmax=800" width="504" border="0" /></a> </p> <p>(b)「ホームページを編集」をクリック</p> <p><a href="http://lh4.ggpht.com/nekonomie/SMcbywspWRI/AAAAAAAAEuw/M6OWg6bwOHo/s1600-h/image21%5B1%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="146" alt="image" src="http://lh6.ggpht.com/nekonomie/SMcbz6bfvLI/AAAAAAAAEu0/RMvkqO4bv3w/image_thumb7.png?imgmax=800" width="504" border="0" /></a> </p> <p>(c)Yahoo! JAPAN IDとパスワードを入れて「ログイン」をクリック <br />(Yahoo! JAPAN IDをお持ちでない方は「Yahoo! JAPAN IDを取得」より取得します。)</p> <p><a href="http://lh4.ggpht.com/nekonomie/SMcb0ucKlJI/AAAAAAAAEu4/ojrqO_vjy28/s1600-h/image9.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="534" alt="image" src="http://lh5.ggpht.com/nekonomie/SMcb1qjf1JI/AAAAAAAAEu8/-1z6ZBrynDE/image_thumb31.png?imgmax=800" width="238" border="0" /></a> </p> <p>(d)元の画面になるので繰り返します。 <br />「ホームページを編集」画面にはindex.htmlが初期値として置いてあります。</p> <p>(e)「EZアップロード」をクリック</p> <p><a href="http://lh3.ggpht.com/nekonomie/SMcb2Is_orI/AAAAAAAAEvA/_nl7zvUZa2o/s1600-h/image24%5B1%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="154" alt="image" src="http://lh3.ggpht.com/nekonomie/SMcb2_uMetI/AAAAAAAAEvE/3shbowvM7So/image_thumb8%5B1%5D.png?imgmax=800" width="425" border="0" /></a> </p> <p>(f)「参照」より3個のFLASH関連ファイルを選択</p> <p><a href="http://lh3.ggpht.com/nekonomie/SMcb3XFuBsI/AAAAAAAAEvI/PH-sBuiDa3o/s1600-h/image33%5B1%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="253" alt="image" src="http://lh5.ggpht.com/nekonomie/SMcb4K4l43I/AAAAAAAAEvM/gRkaYubSLBE/image_thumb11%5B1%5D.png?imgmax=800" width="439" border="0" /></a> </p> <p>(g)「ファイルアップロード」をクリック</p> <p><a href="http://lh5.ggpht.com/nekonomie/SMcb444ihXI/AAAAAAAAEvQ/Bdyx3GxkiyE/s1600-h/image30.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="113" alt="image" src="http://lh4.ggpht.com/nekonomie/SMcb5TxX2SI/AAAAAAAAEvU/KsndXT1I0fE/image_thumb10.png?imgmax=800" width="382" border="0" /></a> <br />アップロード後、編集画面にこの3個のファイルが追加になればOKです。</p> <p>(h)動作確認 <br />ブラウザのアドレス(URL)入力欄に <br /><a title="http://www.geocities.jp/owlnetbb/menu2.html" href="http://www.geocities.jp/owlnetbb/menu2.html">http://www.geocities.jp/owlnetbb/menu2.html</a> <br />(owlnetbb/menu2.htmlの部分はそれぞれ違います。) <br />のように入れて、動作確認をします。</p> <p><span style="color: #0000ff"><strong>(3)iframeタグの作成 <br /></strong></span>Bloggerで使用する為にはiframeタグを作成しておく必要があります。 <br />(a)<a title="http://www.tagindex.com/tool/iframe.html" href="http://www.tagindex.com/tool/iframe.html">http://www.tagindex.com/tool/iframe.html</a> にアクセス <br />(b)次の様に入力 <br />フレームの幅と高さはsw_menu01_white.html(menu2.html)のソースで取得 <br /><a href="http://lh6.ggpht.com/nekonomie/SMcb6PHq8WI/AAAAAAAAEvY/1E7m9LTpRZ8/s1600-h/image3%5B1%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="223" alt="image" src="http://lh5.ggpht.com/nekonomie/SMcb7-iGU3I/AAAAAAAAEvc/kxG5s-jACS4/image_thumb1.png?imgmax=800" width="504" border="0" /></a> <br /><a href="http://lh4.ggpht.com/nekonomie/SMcb8eIz9vI/AAAAAAAAEvg/Om5fd27Xg6k/s1600-h/image18.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 0px 0px 5px; border-right-width: 0px" height="212" alt="image" src="http://lh6.ggpht.com/nekonomie/SMcb9f-tuHI/AAAAAAAAEvk/o5YFUPznONs/image_thumb6.png?imgmax=800" width="504" border="0" /></a> <br />周囲余白を5としたのはFLASHメニューと周囲との余白を少し取りたかったため。</p> <p>(c)「更新する」をクリック</p> <p>(d)「コード選択」をクリック <br /><a href="http://lh5.ggpht.com/nekonomie/SMcb90-KR4I/AAAAAAAAEvo/Zl9GpgJVtCs/s1600-h/image21.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="181" alt="image" src="http://lh5.ggpht.com/nekonomie/SMcb-oqnOqI/AAAAAAAAEvs/UPDqTODIDIs/image_thumb7%5B1%5D.png?imgmax=800" width="494" border="0" /></a> </p> <p>(e)右クリックメニューでコピー</p> <p><a href="http://lh5.ggpht.com/nekonomie/SMcb_ez0hQI/AAAAAAAAEvw/fpJxu_dl3EY/s1600-h/image24.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="241" alt="image" src="http://lh3.ggpht.com/nekonomie/SMccADIrIXI/AAAAAAAAEv0/eN_RxETVSnI/image_thumb8.png?imgmax=800" width="487" border="0" /></a> </p> <p>(f)メモ帳に貼り付け (又は上のフォーム内で直接編集) <br /><iframe src="ファイルのURL" width="625" height="50" frameborder="0" scrolling="no" name="menu" marginwidth="0" marginheight="0" hspace="5" vspace="5">ここに未対応ブラウザ向けの内容</iframe></p> <p>(g)実際のアドレスに変更</p> <p><iframe src="<span style="color: #ff0000">http://www.geocities.jp/owlnetbb/menu2.html</span>" width="625" height="50" frameborder="0" scrolling="no" name="menu" marginwidth="0" marginheight="0" hspace="5" vspace="5"></iframe></p> <p>(h)中央揃いにする為、align="center"を追加(オプション,middleは縦) <br /><iframe <span style="color: #ff0000">align="center"</span> src="<span style="color: #ff0000">http://www.geocities.jp/owlnetbb/menu2.html</span>" width="625" height="50" frameborder="0" scrolling="no" name="menu" marginwidth="0" marginheight="0" hspace="5" vspace="5"></iframe> </p> <p>(i)コードをコピー</p> <p><span style="color: #0000ff"><strong>(4)Bloggerでの作業</strong></span> <br />(a)挿入するブログで「レイアウト」を選択 <br />(b)「ガジェットを追加」を選択 <br /><a href="http://lh3.ggpht.com/nekonomie/SMccAwcINeI/AAAAAAAAEv4/LBCqMvSoRX8/s1600-h/image30%5B1%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 5px 0px; border-right-width: 0px" height="58" alt="image" src="http://lh6.ggpht.com/nekonomie/SMccCVA9ExI/AAAAAAAAEv8/ji9kBCRvglI/image_thumb10%5B1%5D.png?imgmax=800" width="345" border="0" /></a> <br />(c)「HTML/JavaScript」を選択</p> <p><a href="http://lh5.ggpht.com/nekonomie/SMccC6KSt4I/AAAAAAAAEwA/I-iTkn8hJ-g/s1600-h/image33.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="88" alt="image" src="http://lh6.ggpht.com/nekonomie/SMccDlDUUpI/AAAAAAAAEwE/U7ay-qtE8k0/image_thumb11.png?imgmax=800" width="504" border="0" /></a> <br /> <br />(d)「コンテンツ」にiframeコードを貼り付けたら保存</p> <p><a href="http://lh3.ggpht.com/nekonomie/SMccEQHOlbI/AAAAAAAAEwI/6FFRNz_tACg/s1600-h/image27.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="461" alt="image" src="http://lh3.ggpht.com/nekonomie/SMccFdvKGDI/AAAAAAAAEwM/BFqTncVAqCM/image_thumb9.png?imgmax=800" width="504" border="0" /></a> </p> <p>(e)作成された「ガジェット」をブログメニュー位置に移動</p> <p><a href="http://lh5.ggpht.com/nekonomie/SMccGD1V-RI/AAAAAAAAEwQ/gAKvYaCMimo/s1600-h/image36.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="115" alt="image" src="http://lh4.ggpht.com/nekonomie/SMccG_WBZOI/AAAAAAAAEwU/vOnQB0bAyJg/image_thumb12.png?imgmax=800" width="504" border="0" /></a> </p> <p>(f)保存後ブログを表示して確認</p> <p>●このFLASHブログメニューを追加したブログ名は「<a href="http://drawup.blogspot.com/">Google SketchUpの使い方</a>」です。</p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-72918842228688565612008-08-31T19:08:00.002+09:002008-08-31T19:10:16.168+09:00ブログ設定の編集<p>Live Writerでブログ設定を変更したい時は<br />(1)「ブログ/ブログ設定の編集」をクリック</p><p><a href="http://lh4.ggpht.com/nekonomie/SLptZuU3ZqI/AAAAAAAAEmQ/kVgkc1FNB_A/s1600-h/image%5B2%5D.png"><img style="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px" height="141" alt="image" src="http://lh3.ggpht.com/nekonomie/SLptaNrccjI/AAAAAAAAEmU/zSYT8JsysKw/image_thumb.png?imgmax=800" width="490" border="0" /></a> </p><p>(2)「アカウント設定の更新」をクリック</p><p><a href="http://lh5.ggpht.com/nekonomie/SLptaoJECII/AAAAAAAAEmY/0FjZ7VO5WJM/s1600-h/image%5B5%5D.png"><img style="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px" height="263" alt="image" src="http://lh6.ggpht.com/nekonomie/SLptbNjHvOI/AAAAAAAAEmc/suJLSB6f7fQ/image_thumb%5B1%5D.png?imgmax=800" width="469" border="0" /></a> </p><p>(3)変更したい箇所を直します。</p><p>ブログのURLをコピペで入力、Googleアカウントのユーザー名、パスワード(何れもBloggerと同じ)を入力</p><p><a href="http://lh3.ggpht.com/nekonomie/SLptbojqIcI/AAAAAAAAEmg/UM_x4bPdcOg/s1600-h/image%5B17%5D.png"><img style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px" height="433" alt="image" src="http://lh3.ggpht.com/nekonomie/SLptcaRvAaI/AAAAAAAAEmk/I9f5N-5iOR0/image_thumb%5B5%5D.png?imgmax=800" width="504" border="0" /></a> </p><p>※ブログのURLは自分のブログのアドレスをコピー/貼り付けで入れる。</p><p><a href="http://lh5.ggpht.com/nekonomie/SLptcxLnz6I/AAAAAAAAEmo/gJUfg_rKcj8/s1600-h/image%5B23%5D.png"><img style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px" height="72" alt="image" src="http://lh3.ggpht.com/nekonomie/SLptd1wFijI/AAAAAAAAEms/kXTVHtAFAnk/image_thumb%5B7%5D.png?imgmax=800" width="395" border="0" /></a> </p><p>※ユーザ名とパスワードはBloggerでログインするのと同じものを使用</p><p><a href="http://lh6.ggpht.com/nekonomie/SLpteZUyhXI/AAAAAAAAEmw/xaG4C9jtdlA/s1600-h/image%5B20%5D.png"><img style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px" height="145" alt="image" src="http://lh4.ggpht.com/nekonomie/SLpte5eKx0I/AAAAAAAAEm0/8b-KA7Jswig/image_thumb%5B6%5D.png?imgmax=800" width="504" border="0" /></a> </p><p>(4)検出に成功したら「はい」をクリック</p><p><a href="http://lh6.ggpht.com/nekonomie/SLptfj_BfvI/AAAAAAAAEm4/zS9jIGUi4Vs/s1600-h/image%5B8%5D.png"><img style="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px" height="402" alt="image" src="http://lh4.ggpht.com/nekonomie/SLptgZeUYhI/AAAAAAAAEm8/vf8GBuqIxxs/image_thumb%5B2%5D.png?imgmax=800" width="504" border="0" /></a> </p><p>ここでエラーが出るならブログのURLやユーザ名・パスワードが違っていますので再確認してください。</p><p>(5)次の画面が出たら「完了」をクリック</p><p><a href="http://lh6.ggpht.com/nekonomie/SLptg-kIjvI/AAAAAAAAEnA/H0lCLhd7HiE/s1600-h/image%5B14%5D.png"><img style="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px" height="433" alt="image" src="http://lh6.ggpht.com/nekonomie/SLpthsJBEiI/AAAAAAAAEnE/g8OpCEkenwg/image_thumb%5B4%5D.png?imgmax=800" width="504" border="0" /></a></p>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-62729494064464044792008-08-25T17:09:00.001+09:002008-08-25T17:09:07.712+09:00Live WriterからBloggerに画像を投稿する方法<p>Live WriterからBloggerに画像を投稿する方法についてまとめて見ました。 <br />(1)パソコン内にある画像をクリップボード経由で挿入 <br />(a)JTrim,Pixiaだけ <br />JTrim,Pixia等の画像ソフトでリサイズしてからコピペで挿入 <br /><a href="http://lh6.ggpht.com/nekonomie/SLJoJ8O0ydI/AAAAAAAAEkQ/6bAIX6mKb6I/s1600-h/image6%5B1%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px 0px; border-right-width: 0px" height="328" alt="image" src="http://lh6.ggpht.com/nekonomie/SLJoKX1-qpI/AAAAAAAAEkU/tBnECf13hRE/image_thumb2.png?imgmax=800" width="417" border="0" /></a>  <br />(JTrimの時)</p> <p>(b)Picasa2だけ <br />デジカメ編集ソフトPicasa2で編集後エクスポート <br />この時、フォルダのエクスポート先、エクスポートフォルダの名前、サイズ、画質を決める。 <br /><a href="http://lh4.ggpht.com/nekonomie/SLJoK9GafMI/AAAAAAAAEkY/WFY82vNQTMo/s1600-h/image5.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="416" alt="image" src="http://lh6.ggpht.com/nekonomie/SLJoR7VYDkI/AAAAAAAAEkc/5bnL7antoVg/image_thumb1.png?imgmax=800" width="354" border="0" /></a>  <br />エクスポート後、表示された画面で「ブログ用画像」フォルダーをダブルクリック <br /><a href="http://lh3.ggpht.com/nekonomie/SLJoS3cputI/AAAAAAAAEkg/n0lQTqnI1j8/s1600-h/image9%5B1%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="212" alt="image" src="http://lh5.ggpht.com/nekonomie/SLJoT_lLIpI/AAAAAAAAEkk/pWHbdXb7tD8/image_thumb3%5B1%5D.png?imgmax=800" width="504" border="0" /></a> <br />目的の画像をダブルクリック <br /><a href="http://lh3.ggpht.com/nekonomie/SLJoURPTB8I/AAAAAAAAEko/ZtSZyG9syzE/s1600-h/image12%5B1%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="193" alt="image" src="http://lh6.ggpht.com/nekonomie/SLJoVB-HCzI/AAAAAAAAEks/KudUJSNXW60/image_thumb4.png?imgmax=800" width="504" border="0" /></a> <br />右クリックメニューでコピー (画像はVista) <br /><a href="http://lh5.ggpht.com/nekonomie/SLJoW0TDeFI/AAAAAAAAEkw/PBnSs4dVWk4/s1600-h/image15%5B1%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="322" alt="image" src="http://lh3.ggpht.com/nekonomie/SLJoYgBO1_I/AAAAAAAAEk4/-dqt9rWd964/image_thumb5.png?imgmax=800" width="504" border="0" /></a>  <br />(c)Picasa2とJTrimだけ <br />Picasa2で編集後コピー <br /><a href="http://lh3.ggpht.com/nekonomie/SLJoZr2mi0I/AAAAAAAAEk8/Hq0xI8wJklU/s1600-h/image18%5B1%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="331" alt="image" src="http://lh6.ggpht.com/nekonomie/SLJoaSAqOAI/AAAAAAAAElA/DiBBxX7E-WY/image_thumb6%5B1%5D.png?imgmax=800" width="438" border="0" /></a> </p> <p>Jtimで貼り付け、リサイズ後Live Writerへコピペ</p> <p>(2)パソコン内にある画像をLive Writerの「挿入/画像」から挿入 <br />(a)Jtrim等の画像ソフトでリサイズ(800X600,640X480など)して保存 <br />(b)「挿入/画像/ファイルから画像を挿入」より保存した画像を選択 <br /><a href="http://lh3.ggpht.com/nekonomie/SLJoa9g1tlI/AAAAAAAAElE/4Nhgsa7I_8c/s1600-h/image3%5B1%5D.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="349" alt="image" src="http://lh5.ggpht.com/nekonomie/SLJocMXy3RI/AAAAAAAAElI/FrL22_NFsgk/image_thumb.png?imgmax=800" width="504" border="0" /></a> </p> <p>(3)ウェブ上にある画像をクリップボード経由で挿入 <br />(a)画像の上で右クリックし「コピー」(下図はPicasaウェブアルバム) <br /><a href="http://lh5.ggpht.com/nekonomie/SLJodPSq9GI/AAAAAAAAElM/zNZ4eAeZVYQ/s1600-h/image6.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="356" alt="image" src="http://lh6.ggpht.com/nekonomie/SLJoe_Co_dI/AAAAAAAAElU/QeXgVCnHB2M/image_thumb1%5B1%5D.png?imgmax=800" width="504" border="0" /></a> <br />(b)Live Writerに貼り付け</p> <p>(4)ウェブ上にある画像を「挿入/画像」から挿入 <br />(a)画像のプロパティを利用 <br />画像上で右クリックしプロパティをクリック、アドレス(URL)を選択しコピー <br /><a href="http://lh3.ggpht.com/nekonomie/SLJofbgv3WI/AAAAAAAAElY/5ZDwyIcHLjA/s1600-h/image9.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="354" alt="image" src="http://lh5.ggpht.com/nekonomie/SLJofzavh6I/AAAAAAAAElc/R31f7JqvFPY/image_thumb2%5B1%5D.png?imgmax=800" width="504" border="0" /></a> <br />Live Writerの「挿入/画像/Webから画像を挿入/画像のURL」に貼り付け <br /><a href="http://lh5.ggpht.com/nekonomie/SLJogy2D3zI/AAAAAAAAElg/60pz08sPCgM/s1600-h/image12.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="349" alt="image" src="http://lh3.ggpht.com/nekonomie/SLJohi9Ok_I/AAAAAAAAElk/-hGhgDCDwF0/image_thumb3.png?imgmax=800" width="504" border="0" /></a>  <br />「挿入」をクリック</p> <p>(b)「この写真へのリンク」を利用(Picasaウェブアルバム) <br />「この写真へのリンク」をクリック <br /><a href="http://lh3.ggpht.com/nekonomie/SLJoiJx8T1I/AAAAAAAAElo/BxraiVpF79I/s1600-h/image15.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="207" alt="image" src="http://lh4.ggpht.com/nekonomie/SLJoihfnrSI/AAAAAAAAEls/pk1eum9BINA/image_thumb4%5B1%5D.png?imgmax=800" width="266" border="0" /></a> </p> <p>サイズの選択 <br /><a href="http://lh4.ggpht.com/nekonomie/SLJojPblK2I/AAAAAAAAElw/1QcrYa0Aj5Q/s1600-h/image18.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="281" alt="image" src="http://lh3.ggpht.com/nekonomie/SLJojY0P0qI/AAAAAAAAEl0/8IaQ58oqqXI/image_thumb5%5B1%5D.png?imgmax=800" width="258" border="0" /></a>  <br />「HTMLを貼り付けてウェブサイトに埋め込む」をクリックし、画像のURLだけをコピー <br />(imgタグ内のhttp://部分) <br /><a href="http://lh4.ggpht.com/nekonomie/SLJoj3d--WI/AAAAAAAAEl4/sp-JE7ZnpBc/s1600-h/image21.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="274" alt="image" src="http://lh4.ggpht.com/nekonomie/SLJokYHwDXI/AAAAAAAAEl8/0d2m60TE7r4/image_thumb6.png?imgmax=800" width="240" border="0" /></a> <a href="http://lh5.ggpht.com/nekonomie/SLJokxpTImI/AAAAAAAAEmA/RPMe9B_VceY/s1600-h/image24.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="275" alt="image" src="http://lh6.ggpht.com/nekonomie/SLJonA7LQvI/AAAAAAAAEmE/7nS1jonBFQs/image_thumb7.png?imgmax=800" width="234" border="0" /></a> <br />Live Writerの「挿入/画像/Webから画像を挿入/画像のURL」に貼り付け <br />(サイズは288X216) <br /><a href="http://lh4.ggpht.com/nekonomie/SLJon7xqYZI/AAAAAAAAEmI/fgfc1CvEvcY/s1600-h/image27.png"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; margin: 10px 0px; border-right-width: 0px" height="350" alt="image" src="http://lh6.ggpht.com/nekonomie/SLJoon35iWI/AAAAAAAAEmM/uvv3SlJ6wL0/image_thumb8.png?imgmax=800" width="504" border="0" /></a>  </p> <p>※関連ページ <br />・<a href="http://owl.www13.net/">画像の加工例と画像フリーソフトの使い方</a>(Jtrimの使い方,Pixiaの使い方,Picasa2の使い方へのリンク等) </p> Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-37798435.post-16730837949437989362008-08-14T16:18:00.001+09:002008-08-14T16:27:05.302+09:00Googleマップ 目印・直線の色や線幅の変更<p>Googleマップで目印や直線などの色や線幅を変更するには <br />(1)「マイマップ/自分で作った地図」で編集したいタイトルにチェックを入れて「編集」をクリック <br /><a href="http://lh6.ggpht.com/nekonomie/SKPcK6UzdYI/AAAAAAAAEgM/kHaRfNb0TGo/s1600-h/image%5B2%5D.png"><img style="border-right: 0px; border-top: 0px; margin: 10px 0px; border-left: 0px; border-bottom: 0px" height="277" alt="image" src="http://lh4.ggpht.com/nekonomie/SKPcLXyHXMI/AAAAAAAAEgQ/eco0vrdeIw4/image_thumb.png?imgmax=800" width="504" border="0" /></a> <br />(2)線上でクリック <br /><a href="http://lh4.ggpht.com/nekonomie/SKPcLyINo2I/AAAAAAAAEgU/xBcpr3AOo14/s1600-h/image%5B5%5D.png"><img style="border-right: 0px; border-top: 0px; margin: 10px 0px; border-left: 0px; border-bottom: 0px" height="468" alt="image" src="http://lh5.ggpht.com/nekonomie/SKPcMecYumI/AAAAAAAAEgY/3Jzed02aEnE/image_thumb%5B1%5D.png?imgmax=800" width="464" border="0" /></a> <br />(3)<font color="#ff0000" size="5">■</font>の所をクリック <br /><a href="http://lh3.ggpht.com/nekonomie/SKPcM8scevI/AAAAAAAAEgc/99toyBn-z0U/s1600-h/image%5B8%5D.png"><img style="border-right: 0px; border-top: 0px; margin: 10px 0px; border-left: 0px; border-bottom: 0px" height="131" alt="image" src="http://lh6.ggpht.com/nekonomie/SKPcNZadLDI/AAAAAAAAEgg/ZRIivkXiYBo/image_thumb%5B2%5D.png?imgmax=800" width="464" border="0" /></a> <br />(4)変更したい色を選択 <br /> <a href="http://lh6.ggpht.com/nekonomie/SKPcOf9p7WI/AAAAAAAAEgk/fYj-y0WS8AE/s1600-h/image%5B17%5D.png"><img style="border-right: 0px; border-top: 0px; margin: 10px 0px; border-left: 0px; border-bottom: 0px" height="349" alt="image" src="http://lh5.ggpht.com/nekonomie/SKPcO_pmiUI/AAAAAAAAEgo/ggc3vFwhcfQ/image_thumb%5B5%5D.png?imgmax=800" width="401" border="0" /></a> <br />ここで線幅や線の透明度も変更できます。 <br /> <br />なお目印の場合は色のほか形状も変更できます。 <br /><a href="http://lh3.ggpht.com/nekonomie/SKPeQcZ2IxI/AAAAAAAAEgs/e6kBk56vho8/s1600-h/image%5B20%5D.png"><img style="border-right: 0px; border-top: 0px; margin: 10px 0px; border-left: 0px; border-bottom: 0px" height="435" alt="image" src="http://lh6.ggpht.com/nekonomie/SKPeQwkzUXI/AAAAAAAAEgw/qBK7hPiEZRU/image_thumb%5B6%5D.png?imgmax=800" width="414" border="0" /></a></p> Unknownnoreply@blogger.com0