2017年8月5日土曜日

2017年8月3日木曜日

ThunderBirdでIMAP メール

◆IMAP メールアカウントの設定
•サーバ名: imap-mail.outlook.com
•ポート: 993
•ユーザ名: ****@outlook.jp
•接続の保護: SSL/TLS
•認証方式: 通常のパスワード認証
•サーバ設定の残りの部分は、お好みの設定に変更してください。
◆POP メールアカウントの設定
•サーバ名: pop-mail.outlook.com
•ポート: 995
•ユーザ名: *****@outlook.jp
•接続の保護: SSL/TLS
•認証方式: 通常のパスワード認証
•サーバ設定の残りの部分は、お好みの設定に変更してください。
◆送信サーバの設定
1. 左側のパネルの最下部で、送信 (SMTP) サーバ を選択します。右側のパネルに設定された送信サーバが表示されます。
Hotmail サーバは、Microsoft Live Hotmail または似た名前で登録されているでしょう。
2. Hotmail のサーバを選択し、編集 ボタンをクリックしてください。
設定ダイアログが開いたら、以下のように設定してください: ◦
サーバ名: smtp-mail.outlook.com
◦ポート: 587
◦接続の保護: STARTTLS
◦認証方式: 通常のパスワード認証
•ユーザ名: ****@outlook.com

Mozzila
https://support.mozilla.org/ja/kb/thunderbird-and-hotmail

2017年8月2日水曜日

。。。


[css] pointer-events:none; でリンクを非リンクに変える

[css] pointer-events:none; でリンクを非リンクに変える | 鹿児島のホームページ制作 株式会社 カナメン
2014.2.22
author : canamen, Inc.
「pointer-events:none;」はレスポンシブで重宝する可能性が高いです。
「pointer-events:none;」をレスポンシブで使用する方法や考え方はこちらから。合わせてご確認ください!
pointer_events_index
メニューリストを作成して、現在閲覧中のページのaタグをspanタグに変えリンク無効にするか、
aタグのままで表示してしまうか、悩みますよね。
「pointer-events:none;」を指定することで、タグのリンクを無効にしてる。
「pointer-events」の導入方法とメリット・デメリット
リンクを非表示にしたい項目の親要素にidを付けcssで装飾を変更する
メリット
    ・各ページのcssをbodyタグで制御できる。
デメリット
    ・cssのコードが増えてしまうので、読み込みに時間がかかる可能性がある。
各ページ毎に読み込むcssを分け装飾を変更する
メリット
    ・各ページの読み込み時間の短縮が可能。
デメリット
    ・cssを作成していくと共有と各ページで重複するソースが増えてしまう。
    ・作成に時間がかかります。
ポイント
時間があったり、綺麗なソースにしたい場合のみcssを分けた方がいいと思います。
それ以外は親要素にidを付けて使用しましょう。
ページ数が膨大になる場合、ページロード時間を短くする為に共通のcssと各ページ毎のcssの2種類をlinkさせるサイトが多いです。
「pointer-events」ソースコード例
//html
//css
#list a.about
{
pointer-events:none;/*リンクを非リンクに変える*/
cursor:default;/*マウスカーソルを矢印のまま変えない*/
text-decoration:none;/*下線を消す*/
color:#000000;/*非リンクの文字色と同じにする*/
}
補足
非リンクになっても、他のリンクと装飾は変わらないので、装飾を変えて一目で非リンクだと分かるようにした方がいいでしょう。
対応ブラウザが少ないので、過信は禁物です。

株式会社 カナメン
https://canamen.co.jp/css/css-pointer-eventsnone/

Google feed API

ブログサイトなどのRSSを取り込んで画像も一緒に表示させるフィード機能
2/3/2012
こんにちは。WEBコンテンツ・プランナーの中島です。
今回、自分の備忘録としてのメモも含め、サイト制作に便利な機能を紹介していくシリーズ展開していきたいと思います。
今回は、ブログ等を展開している人が、自分のホームページにブログサイトなどのRSSを取り込んで画像も一緒に表示させるフィード機能についてご案内します。
RSSのURLを入れこむだけでJavaScriptを書きでしてくれる便利な機能のモノもいろいろありますが、
カスタマイズできない物が多く見られます、と言うか、全てがパッケージ化されているものなので自由なデザインにすることが出来ません。
(誰でも簡単に使用できるようにしているため仕方のないことだと思います)
かなり高機能なものがありますが、
デザイン的な部分に目をつぶらなければならない場合が多いです。
せっかくデザインを自分自身で制作しているならデザイン的に自由に使えるRSSフィードを導入したいって思いますよね。
ただし、自由にデザインを設定できるとなると、やはりHTML,CSSを組める知識は必要になります。
WeeblyやJimdoなどの簡単サイト作成CMSサイトでもカスタムHTMLの記述ボックスを組み込めるサイトならもちろん、
自分でコーディングしているオリジナルのサイトでも使用可能な方法を紹介したいと思います。
【Google feed APIという便利な機能を利用します】
google feed apiのjavascriptを使って、ブログの更新情報を表示させたい画像サイズでサムネイル画像を表示させて、
タイトルと本文がリスト表示される。
さらに、外部へのリンクの場合、新規ウィンドウでリンク先を表示させたい、
そして、「続きを読む…」とかの誘導リンクも付ける。
こんな贅沢な設定を自分で、コーディングでやってしまおうという内容で進行していきます。

Cre'ps inc.
http://www.creps-inc.jp/tips_post/first-post













google.load("feeds", "1");
function initialize() {
  var feedurl = "http://creps-inc.weebly.com/2/feed"; //rssフィードのurlを指定。wordpressの場合はurl/feed/で取得できる。
  var feed = new google.feeds.Feed(feedurl);
  feed.setNumEntries(8); //フィードの表示数を入れる
  feed.load(dispfeed);
  function dispfeed(result){
    if (!result.error){
      var container = document.getElementById("feed");
      var htmlstr = "";
      htmlstr += "
    ";

      for (var i = 0; i < result.feed.entries.length; i++) { //ループ処理
        var entry = result.feed.entries[i];
        var eimg = ""; //画像取得(初期値設定)
        var imgCheck = entry.content.match(/(src="http:){1}[\S_-]+((\.png)|(\.jpg)|(\.JPG))/); //該当する拡張子のデータを画像として取得している
        if(imgCheck){
                 eimg += ''; //eimgにはimgタグを挿入するように設定、大きさは100ピクセル
      }
        htmlstr += '
  • '

  •         var strdate = createDateString(entry.publishedDate);
            htmlstr +=  ' ';
            htmlstr +=  '
    ' + entry.title + '' + '' + entry.contentSnippet.substr(0,140) + '' + strdate + '
    ';

            htmlstr += "
    "      }
          htmlstr += "
    ";       container.innerHTML = htmlstr;
        }else{
           alert(result.error.code + ":" + result.error.message);
        }
      }
    }
    function createDateString(publishedDate){
      var pdate = new Date(publishedDate);
      var pday = pdate.getDate();
      var pmonth = pdate.getMonth() + 1;
      var pyear = pdate.getFullYear();
      var phour = pdate.getHours();
      var pminute = pdate.getMinutes();
      var psecond = pdate.getSeconds();
      var strdate = pyear + "/" + pmonth + "/" + pday ;
      return strdate;
    }
    google.setOnLoadCallback(initialize);

    Cre'ps inc.
    http://www.creps-inc.jp/tips_post/first-post














    貼るだけ簡単RSS表示用ブログパーツ!


    貼るだけ簡単RSS表示用ブログパーツ!
    お気に入りサイトの最新情報・投稿記事をブログやHPに掲載

    貼るだけ簡単RSS表示用ブログパーツ!
    https://feed.mikle.com/ja/

    Blogger RSSフィード


    [Blogger] 今すぐ知りたい人へ!RSSフィードのURLを確認する方法 | Bloggerをカスタマイズするときに見るブログ
    BloggerブログのRSSフィードURLをご紹介:)
    RSSフィードURL
    ブログ全体のRSSフィード
    Atom 1.0
    http://ブログ名.blogspot.com/feeds/posts/default
    RSS 2.0
    http://ブログ名.blogspot.com/feeds/posts/default?alt=rss
    RSSフィードを利用する人がどちらか選べるように、URLは2つ用意されています。
    Feedburnerなどに設定する際は、どちらのURLを設定しても正常に動作します。

    Bloggerをカスタマイズするときに見るブログ
    http://www.blogger-customize.com/2013/11/rss.html