CANPAN ブログ検索
Loading
  • もっと見る
« タイトルの部分 | Main | その他»
リンクタグの説明 [2012年01月05日(Thu)]
仙台のCILたすけっと、小椋さんから
リンクタグについて、コメントをいただきましたので
ご紹介します笑い

CANPANブログでリンクを貼ると
標準では別ウィンドウで表示されます。
同ウィンドウで表示するには
リンクを設定した際に、タグの中のtarget="_blank"を削除するだけですまる

リンクの際のアクセシビリティについては
CANPAN BLOG アクセシビリティ・ガイドをご覧ください。


参考まで、以下にリンクタグの説明を掲載します。

@同ウィンドウでリンクを貼るタグ
<A Href="URL">文字</A>

(例)
<A Href="https://blog.canpan.info/document/">ブログ入門</A>
   ↓
ブログ入門

A別ウィンドウでリンクを貼るタグ
<A Href="URL" Target="_blank">文字</A>

(例)
<A Href="https://blog.canpan.info/document/" Target="_blank">ブログ入門</A>
   ↓
ブログ入門


B同ウィンドウでリンクを貼り、文字にマウスを乗せるとリンク先の説明が表示されるタグ
<A Href="URL" Title="リンク先の説明">文字</A>

(例)
<A Href="https://blog.canpan.info/document/" Title="ブログ入門。CANPANブログの意味や活用法など紹介しています">ブログ入門</A>
   ↓
ブログ入門

C別ウィンドウでリンクを貼り、文字にマウスを乗せるとリンク先の説明が表示されるタグ
<A Href="URL" Target="_blank" Title="リンク先の説明">文字</A>

(例)
<A Href="https://blog.canpan.info/document/" Target="_blank"
Title="ブログ入門。CANPANブログの意味や活用法など紹介しています">ブログ入門</A>
   ↓
ブログ入門
CANPANブログをPDFの本にする [2011年08月17日(Wed)]
CANPANブログは
Movable Type形式で作られているので
Movable Type形式対応のWebサービスを利用すれば
ブログ記事をPDFの本にすることができます。

まず、ブログのデータを自分のパソコンに保存します。

@ログイン後、設定をクリック
Aエクスポート(記事書出し)をクリック
Bエクスポート(記事書出し)するをクリック
Cテキストドキュメントを自分のパソコンに保存

続きを読む・・・
(続)PDFファイルの活用のススメ [2011年08月15日(Mon)]
2年半ほど前にPDFファイルの活用のススメの記事を書きました。

最近ではスマートフォンの普及もあり、
さらにPDFファイルの活用の場が増えています。

CANPANブログでは他のブログサービスではあまりない
PDFファイルの公開が可能です。


pdfsusume.pdf

←この記事のPDFファイル



1記事5ファイル、1ファイル10メガバイト(1記事で合計50メガ)まで
公開できますので
CANPANブログを団体、個人の
情報公開、情報発信のツールとして活用しない手はありませんまる


PDFを活用するにあたって
前回の記事の時に市販のソフト(Acrobat XいきなりPDFJUST PDF 2…)や
フリーソフトの紹介をしましたが、

2年半経過した現在、
私が使っているソフト、活用法などを
紹介したいと思います。

無料のものがほとんどです(^^ゞ

●PDF作成
 ・CubePDF無料
  セキュリティー設定や白黒のPDF作成も簡単にできます。

 ・Office2007、2010
  Office2007以降は「名前を付けて保存」でPDFに変換できます。

 ・OpenOffice.org3.3無料
  PDF作成だけでなく、Oracle PDF Import Extensionをインストールすれば編集も可能。

●PDF編集
 ・Foxit J-Reader無料
  PDFへの書き込み、マーカーや下線、リンク、添付ファイル、しおりの作成などできます。

 ・PDForsell無料
  PDFファイルの結合、分割、回転ができます。プレビューがついていて使いやすいです。

●Webサービスの利用
 ・Primo Online無料
  ソフトをインストールせずに、ネットサービスを利用してPDFファイルを作成。
  Office2007、2010は未対応。

 ・PDF to Word無料
  PDFファイルをWord文書に変換。英語のサイトですが、使い方は簡単です。

 ・PDF to Excel無料
  PDFファイルをExcel文書に変換。英語のサイトですが、使い方は簡単です。

●その他
 ・画像梱包無料
  複数の画像をまとめて1つのPDFファイルにできるので、簡単にアルバムが作成できます。

 ・GoodReader(600円)※iPhone、iPod用アプリ
  PDFファイルの閲覧だけでなく、編集機能、Safari経由でWebページをPDF化できます。

 ・CANPANブログをPDFの本にする(別記事にて紹介)
デザインスキンで個別記事ごとにツイートボタンといいね!ボタンを設置 [2011年04月20日(Wed)]
CANPANブロガーの高橋さんから
「デザインスキンで個別記事ごとにツイートボタンといいね!ボタンを設置するには?」と
質問をいただきましたわーい(嬉しい顔)




カスタムスキンの設置方法は以前書いたのですが、

デザインスキンの設置方法は
以下のコードを毎回、記事に貼り付けるしか
私には思い浮かびませんあせあせ(飛び散る汗)

ただ赤字の部分を変更して貼り付けるだけなので

あらかじめメモ帳などにコピーしておけば
そんなに手間は掛からないと思います。

ブログ記事のアドレス部分は末尾の数字を増やすだけ、
ブログの名前は事前に入力しておけば楽でするんるん

ちなみに、以下のコードは
CANPANブログ以外のブログにも活用できますので
よろしければご利用ください。

―――――――――――― ココから ――――――――――――


<!-- デザインスキンで個別記事ごとにTwitterのツイートボタンとfacebookのいいね!ボタンを設置 START -->

<a href="http://twitter.com/share" class="twitter-share-button" data-url="ブログ記事のアドレス" data-text="『ブログの名前』 記事のタイトル" data-count="horizontal" data-lang="ja">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script><iframe src="http://www.facebook.com/plugins/like.php?href=ブログ記事のアドレス&layout=button_count&amp;show_faces=false&amp;width=300&amp;action=like&amp;font&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:21px;" allowTransparency="true"></iframe>

<!-- デザインスキンで個別記事ごとにTwitterのツイートボタンとfacebookのいいね!ボタンを設置 END -->

―――――――――――― ココまで ――――――――――――


赤字の部分の変更例として
この記事に設置した場合のコードを参考まで掲載しますメモする

<!-- デザインスキンで個別記事ごとにTwitterのツイートボタンとfacebookのいいね!ボタンを設置 START -->

<a href="http://twitter.com/share" class="twitter-share-button" data-url="https://blog.canpan.info/document/archive/66" data-text="『ブログ入門』 デザインスキンで個別記事ごとにツイートボタンといいね!ボタンを設置" data-count="horizontal" data-lang="ja">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script><iframe src="http://www.facebook.com/plugins/like.php?href=https://blog.canpan.info/document/archive/66&layout=button_count&amp;show_faces=false&amp;width=300&amp;action=like&amp;font&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:21px;" allowTransparency="true"></iframe>

<!-- デザインスキンで個別記事ごとにTwitterのツイートボタンとfacebookのいいね!ボタンを設置 END -->
個別記事ごとにTwitterのツイートボタンとfacebookのいいね!ボタンを設置する方法 [2011年04月16日(Sat)]
情報共有に少しでも役立てればと、

カスタムスキンの方限定ですが、
CANPANブログの個別記事ごとに
Twitterのツイートボタンとfacebookのいいね!ボタンの設置方法を紹介します笑い

カスタムスキン以外の方は
デザインスキンで個別記事ごとにツイートボタンといいね!ボタンを設置
参考にしてください。

個別記事ごとのTwitterのツイートボタンとfacebookのいいね!ボタンの設置方法ですが、
以下のコードを、
メイン、アーカイブ、1記事テンプレートに
それぞれ貼り付けるだけで、設置完了ですまる

―――――――――――― ココから ――――――――――――

<!-- ブログの個別記事ごとにTwitterのツイートボタンとfacebookのいいね!ボタンを設置 START -->

<a href="http://twitter.com/share" class="twitter-share-button" data-url="{$BlogEntryPermalinkUrl$}" data-text="『{$BlogName$}』{$BlogEntryTitle$}" data-count="horizontal" data-lang="ja">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<iframe src="http://www.facebook.com/plugins/like.php?href={$BlogEntryPermalinkUrl$}&layout=button_count&amp;show_faces=false&amp;width=300&amp;action=like&amp;font&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:21px;" allowTransparency="true"></iframe>

<!-- ブログの個別記事ごとにTwitterのツイートボタンとfacebookのいいね!ボタンを設置 END -->

―――――――――――― ココまで ――――――――――――

あと、
メイン、アーカイブ、1記事テンプレートの
どこにコードを挿入すればよいか

個人的なオススメ箇所を
赤色で色づけし、画像で表示しましたので
参考になれば幸いです


続きを読む・・・
大切な仲間の写真をスライドショー(動画)で紹介 [2010年03月22日(Mon)]
3月12日から2泊3日で
神奈川県葉山町に研修に行ってきました自動車ダッシュ

コメントをいただいた
NPO法人まつえ・まちづくり塾さんのブログを参考に

研修で出会った大切な仲間の写真を
スライドショー(動画)にしてみました笑い



今回のスライドショーを作成するに当たっては
ウィンドウズに標準搭載されている
Windows Movie Makerを使いました。

OSがVista以降の人は
Windows Live ムービーメーカーが使えます。

職場では動画の編集は
Adobe Premiereを使っていますが、

自宅のパソコンにはソフトがないので
初めてWindows Movie Makerを使いました。

感想としては、簡単な動画編集なら、
Windows Movie Makerで十分な気がします。


研修で出会った大切な仲間と
また再び出会えた日には

海や笑顔を加えた
もっともっときれいな動画を紹介できると思います。
楽しみです笑い音符
PDFファイルの活用のススメ [2009年03月25日(Wed)]
イベント案内やボランティア募集のチラシなどを
ブログ上でPRする時に
マイクロソフトオフィスのワードファイル

エクセルファイル
で公開している方も多いと思います。


ワードやエクセルのファイルで公開するよりも
個人的には、
PDFファイル
に変換して公開することをお勧めしますOK


PDFファイルは
無料でダウンロードできるPDFリーダーをインストールすれば
使用しているOSや
インストールしているソフトに関係なく見られますし(最近では携帯電話でも閲覧可能)、

元データに比べて、
PDFファイルにすると
ファイルサイズを小さくすることができます笑い

誰でも環境に関係なく閲覧できるので
公共機関のホームページでは広報誌や各種申請書などの様式は
PDFファイルでの提供が多くなっています。

ワードやエクセルなどのファイルを
PDFファイルに変換するソフトとして
使い勝手がよいのは『Adobe Acrobat』や
『いきなりPDF』などの有料ソフトですが、

個人的には、無料で使えるフリーソフトでも
十分活用できると思っています。

(参考)PDF変換ソフト・PDFフリーソフト比較
    http://www.click-assist.com/blog/compare.php


この機会に、
PDFファイルの活用にチャレンジしてみては
いかがでしょうかはてな


Google カレンダーの掲載方法 [2009年03月06日(Fri)]

個人的に、
最近はGoogleのサービスを利用する機会が増えています。
Googleのサービスの一つにカレンダー機能があります。

みんなとイベントなどの予定を共有したい、お知らせしたいといった時に
カレンダーをブログに掲載すると
ブログを見るだけで予定がわかるので、とても便利です笑い

Googleにログイン後、

マイ・カレンダー ⇒ 
カレンダー設定 ⇒ 
カレンダーのアドレス HTML ⇒ 
設定ツール ⇒ 
サイズや表示項目を調整後、コードをブログに貼り付け

以上の2〜3分の作業で、
以下のようにGoogle カレンダーをブログに掲載することができますまる




記事の中に表を書いてみよう [2009年02月16日(Mon)]
ブログの中で、記事やサイドバーの部分には
以下のような表を挿入することができます笑い


チーム名\回 1回 2回 3回 4回 5回 6回 7回 8回 9回 合計
Aチーム 1 0 0 0 3 0 0 0 0 4
キラキラBチームキラキラ 2 0 0 1 0 0 0 0 2 5


参加者募集中音符



表は<TABLE>というタグを使って書いています。
※タグの詳細についてはHTMLタグ辞書を参考にしてください。


私が<TABLE>タグを書くときに使っているサイトに
テーブルタグ作成ツールがあります。

自動的にタグを書いてくれるので
簡単な表なら十分に対応できると思いますまる




(参考)
上記の対戦表&参加者募集(青枠)の表のソースは以下の通りです。
コピーして貼り付けると、上記の表が表示されます。


続きを読む・・・
メインページの自由記述の欄への画像の貼り付け方 [2008年12月03日(Wed)]
髭爺さんから以下の質問をいただきました。

> ところで、メインページの自由記述の欄に画像を
> 貼り付けることはできないものでしょうか?

メインページの自由記述については、
メインのページの一番上に常に記事を表示するには?
をご覧ください。


普通に新規記事を作成する場合には
タグアイコンの右端に「画像・ファイル」のアイコン
がありますが、
メインページの自由記述にはありません。


メインページの自由記述の欄へ画像を貼り付けるには
アイコンがないため、
手書きで画像を掲載するタグを書く必要があります。

タグを書く前に、まず掲載する画像を
下書き記事に保存する必要があります。
方法は
大きな写真を表示させるには?(下書き記事に保存したファイルへの直リンク)
を参考にしてください。


下書きした記事の
プレビューで表示されている写真を右クリックして
アドレスをコピーします。

画像を掲載するタグは以下のとおりですので、
アドレスの部分を変更すれば
メインページの自由記述の欄に画像を表示できます。

<img src="アドレス" border="0">


画像にリンクを貼ったりしたい場合は、
サイドバーでよく使うタグ一覧
を参考にしてください。
| 次へ