see more 2012-10 - ponnao-clip

Home > アーカイブ > 2012-10

2012-10

瞑想は「衝動に抵抗する能力」を養う~忙しい人ほど瞑想しよう : ライフハッカー[日本版]
http://www.lifehacker.jp/2012/10/1210026busytomeditate.html

【緑茶最強説】もう薬はいらないかも!?科学的に立証されている緑茶の7大健康効果 | IRORIO(イロリオ) – 海外ニュース・国内ニュースで井戸端会議
http://irorio.jp/asteroid-b-612/20121024/33215/

どこでも出来る“指ヨガ”で疲れた体をあっという間にほぐす方法 | セレブスタイル
http://celeb-style.jp/blog/1129/

【片頭痛持ちの方へ】薬に頼らず少しでも痛みを和らげる方法 | セレブスタイル
http://celeb-style.jp/blog/1137/

カオスちゃんねる : 瞑想やれよ人生変わるぞ
http://chaos2ch.com/archives/3582390.html

知らないと危険!? 十分な睡眠をとるために寝る前に注意すること | セレブスタイル
http://celeb-style.jp/blog/1085/

女性の最大の敵「ほうれい線」はこうやって消す!まとめ31個 – M3Q
http://m3q.jp/t/177

あなたのメイク直しは間違ってる!驚愕のプロのテク3つ | 美レンジャー
http://www.biranger.jp/archives/51819

体脂肪を減らすには?女性・男性でも、簡単に痩せられます。 – NAVER まとめ
http://matome.naver.jp/odai/2134883409742397501

ジョギングの効果はすごいぞwwwwwwwwww ニュース速報BIP
http://404nots.blog88.fc2.com/blog-entry-1043.html

Googleカレンダーに天気予報や映画公開予定をインポートしておくと便利
http://samulife.com/iPhone/googlecalendar-import

日本語住所を英語表記に変換するWebサービス「JuDress」がちょー便利!! | OZPAの表4
http://ozpa-h4.com/2012/10/29/judress-address-from-japanese-to-english/

ついに出る!誰でもかんたん夜空におえかきペンライト – PiKA PiKA – | STYLE4 Design
http://design.style4.info/2012/10/pika-pika/

とある飴を食べるようになってから風邪ひかなくなった。:キニ速
http://blog.livedoor.jp/kinisoku/archives/3596530.html

スマートフォンで良い写真を撮る方法 : ギズモード・ジャパン
http://www.gizmodo.jp/2012/10/post_11055.html

YouTubeからダウンロードしたFLV動画を無劣化でMP4に変換する方法 | フリーソフト,Windows PC活用情報局
http://antarespc.com/tips/youtube-flv-to-mp4.html

【メモ】アマゾン人気第1位のバスタオル気持ち良すぎワロタw:マインドマップ的読書感想文
http://smoothfoxxx.livedoor.biz/archives/52043961.html

まだまだ現役!XPで戦い続けるためのTips – NAVER まとめ
http://matome.naver.jp/odai/2135123317295771301

東京ディズニーシーの見所などを勝手に案内してみようと思う BIPブログ
http://bipblog.com/archives/4241936.html

江戸時代の貨幣価値換算表
http://www.teiocollection.com/kakaku.htm

読者の99.9%が完っ全に欺かれるミステリ小説まとめ – NAVER まとめ
http://matome.naver.jp/odai/2135091350660352901

年収100万円減でも一生豊かに暮らす方法のまとめ | ブクペ
http://bukupe.com/summary/5169

エクセル・パワポがグッと見やすくなる配色のルール – NAVER まとめ
http://matome.naver.jp/odai/2135097299165694701

ファイルサイズ制限なしで巨大ファイルを直接相手に送信できるフリーソフト「zeZebra」 – GIGAZINE
http://gigazine.net/news/20121023-zezebra/

お前らが最高だと思うピアノ曲を一曲だけ貼って寝ろ : はれぞう
http://blog.livedoor.jp/darkm/archives/51455609.html

自炊したPDFファイルの余白を自動で削除できるフリーソフト「PDFDiet」 – GIGAZINE
http://gigazine.net/news/20121017-pdfdiet/

読みやすい文章を書くための効果的な11の工夫。「頭がいい人の文章の書き方」:Blogで本を紹介しちゃいます。
http://blog.livedoor.jp/tkfire85/archives/55539892.html

iPhone版のChromeが本気で便利すぎる件*ホームページを作る人のネタ帳
http://e0166.blog89.fc2.com/blog-entry-1070.html

おーい、月額無料で050番号が使えるぞー「IP-Phone SMART」で : ギズモード・ジャパン
http://www.gizmodo.jp/2012/10/121009_050ip-phone_smart.html

メールがパッと華やかになる「特殊顔文字」50個まとめ (。◕ ∀ ◕。) | 和洋風KAI
http://wayohoo.com/emoticons/summary-of-unique-emoticon.html

予約もできる! バーコード認識で本の情報をEvernoteに記録できるアプリ : ライフハッカー[日本版]
http://www.lifehacker.jp/2012/10/121010bookever00.html

【画像125枚】アラフォーが懐かしい画像を淡々と貼っていく
http://vip.2chblog.jp/archives/18716631.html

ニトリへ走れ!iPad収納付きのガジェットまとめ板がたったの799円で販売中! | WONDER LIFE
http://blog.wondermarketing.info/archives/1772

電子レンジを簡単綺麗に掃除する方法, 裏ワザ | The Cake Magazine | 宅配ケーキ店のステキ系情報マガジン
http://clickoncake.com/magazine/%E6%9C%AA%E5%88%86%E9%A1%9E/%E9%9B%BB%E5%AD%90%E3%83%AC%E3%83%B3%E3%82%B8%E3%82%92%E6%B4%97%E3%81%86/

コスパ最高!値段以上の音がすると評判の1,500円ヘッドホンが本当にすばらしかった、という話 – リニューアル式
http://d.hatena.ne.jp/renewal49/20121007/1349607841

Dropbox 活用大全 – NAVER まとめ
http://matome.naver.jp/odai/2134525416226380401

ブックマークを整理して、サイト管理をもう一度快適にしよう! | enjiBlog
http://rentalhomepage.com/webservice/bookmark/

完全保存版!絶対に読んでおきたいお金が貯まる良エントリー41記事 – nanapi Web
http://nanapi.jp/topics/246

耳から外したイヤホンを首にかけてスグに装着できる位置にキープする「Props」 – GIGAZINE
http://gigazine.net/news/20121008-quirky-props/

「ひらくPCバッグ」は持ち歩く書斎を実現する発明だった! | Lifehacking.jp
http://lifehacking.jp/2012/10/hiraku-pc-bag/

【文房具】地味にスゴイ!ハサミに訪れた3000年目の進化(1/2) – ウレぴあ総研
http://ure.pia.co.jp/articles/-/4257

逃げろ、そして生き延びろ – インターネットの備忘録
http://d.hatena.ne.jp/hase0831/20121002

「社員を使い潰す」デメリット – インターネットの備忘録
http://d.hatena.ne.jp/hase0831/20121004

「逃げ出す」前にできることリスト – インターネットの備忘録
http://d.hatena.ne.jp/hase0831/20121006

インテリア雑貨や小物が見つかるショップx6 | CREAMU
http://blog.creamu.com/mt/2012/10/x5.html

売掛金回収!少額訴訟してみたよ。 | WP-D
http://wp-d.org/2012/10/03/621/

鉄道Now
http://www.demap.info/tetsudonow/

はてブ数2000超え!ライフハック記事40本まとめ【実験】 | 男子ハック
http://www.danshihack.com/2012/09/28/junp/hatebu-2000-lifehacks.html

au版iPhone5の「○(まる)問題」を1分30秒で解消する簡単な方法 – すまほん!!
http://smhn.info/201209-kddi-au-iphone5-maru

zurui-design // Speaker Deck
https://speakerdeck.com/ken_c_lo/zurui-design

WordPressにメール配信機能を付ける「Subscribe2」が凄い! | トラベルハック|あなたの冒険を加速する
http://travelhack.jp/2012/10/29/subscribe2-wordpress/

Web制作するときに探す素材サイト&参考にするサイトまとめ | ナナメウエBlog
http://nanameue.jp/blog/webcheck/

Subtle Patterns | Free textures for your next web project
http://subtlepatterns.com/

新しいテーマを作ったりするときにローカル環境無しでWordPressのテストが出来るTheme Test Drive | ごりゅご.com
http://goryugo.com/20121028/theme_test_drive/

[ HUE / 360 ] The Color Scheme Application
http://hue360.herokuapp.com/

すごいWEB
http://sugoiweb.nezihiko.com/

jQuery用のシンプルなURLパーサー『jquery-url』 | IDEA*IDEA
http://www.ideaxidea.com/archives/2012/10/jquery_url.html

ノンデザイナーのための配色理論
http://www.slideshare.net/saucerjp/ss-14902681

SEO順位に影響を与える全65項目のチェックリスト | バズ部
http://bazubu.com/seo-ranking-factor-10400.html

【初心者向け】WEBクリエイターになるための入門7レッスン | DECONCEPTER
http://log.deconcepter.jp/2012/10/webbeginner/

プレゼン資料にも最適、インフォグラフィック用無料ベクター素材16個まとめ – Photoshop VIP
http://photoshopvip.net/archives/39866

画像の専門家も「魔法のようだ」と驚愕! ピンぼけ写真を修復できるプログラムが開発される | ロケットニュース24
http://rocketnews24.com/2012/10/26/260658/

意外と探すのが面倒なシンプルフリーフォントの数々!有名所含めシンプル目な物のみ一挙ご紹介! | バンクーバーのうぇぶ屋
http://webya.opdsgn.com/typography/simplefreefonts2012/

JavaScriptをまじめに考えました+
http://www.slideshare.net/taikiken/javascript-14882630

【Webデザイナ-・コーダー向け】すぐに使えるSCSS入門|知らないと損な機能編 | クラスメソッド開発ブログ
http://dev.classmethod.jp/ria/html5/web-desiner-corder-scss-design/

HTML5の学習に役立つ(主に)日本語のサイトまとめ2012 – WEBCRE8.jp
http://webcre8.jp/collect/html5-resource-japanese.html

Googleアナリティクスで大切な「目標設定」の完全設定ガイド | nanapi [ナナピ]
http://nanapi.jp/51599/

文書構造を意識しながらHTMLマークアップしよう! | Webクリエイターボックス
http://www.webcreatorbox.com/tech/html-semantic-markup/

デザインも豊富、カスタマイズも可、ローディング用のGIFアニメーションをさくっと作成できる -Loader Generator | コリス
http://coliss.com/articles/web-services/online-loader-generator.html

チラシ(フライヤー)・ポスター・パンフレットデザイン事例集と無料テンプレート集まとめ
http://www.tommyjp.com/2012/10/flyer-poster-brochure-design-inspiration-free-template.html

和のデザインに使える!国内商用可フリー素材・素材サイトまとめ | Kana-Lier
http://kana-lier.com/material/japanese_material_01/

ここまで小さくなるの!? PNGを非可逆圧縮する「TinyPNG」がスゲェ!! | [M] mbdb
http://mbdb.jp/web/tinypng.html

隠したいファイルやフォルダーにパスワードを付け非表示にできるフリーソフト「Wise Folder Hider」 – GIGAZINE
http://gigazine.net/news/20121021-wise-folder-hider/

WordPress使いならこれだけはやっておきたい本当のセキュリティ対策10項目 | WP-D
http://wp-d.org/2012/10/18/806/

たった1行で完成?凄まじくレスポンシブデザインなサイトの作り方 | DECONCEPTER
http://log.deconcepter.jp/2012/10/responsivedesign/

Google Analyticsでサイトの課題発見&気付きに繋がる4つのカスタムレポート | nanapi [ナナピ]
http://nanapi.jp/49879/

nakano_neko, 画像の右側が外注さんに頼んだソースコード。左側が僕が書きなおしたソースコード。…
http://ac7.tumblr.com/post/33569124174

これが出来れば中級者!Illustrator初心者のための「ロゴ作成講座」 | OZPAの表4
http://ozpa-h4.com/2012/10/15/how-to-make-logo-by-illustrator/

なんだこれ!!「NHKスタジオパーク」のレスポンシブ・ウェブデザインが凄まじくレスポンシブ!! | gori.me
http://gori.me/it/21341

NHKスタジオパーク
http://www.nhk.or.jp/studiopark/index.html

ウェブ制作者に必ず役立つ!iOS, HTML5, CSS, jQuery, WordPress, .htaccessなどのチートシートのまとめ | コリス
http://coliss.com/articles/build-websites/operation/work/cheat-sheets-for-front-end-developer-2012.html

Webデザイナーにオススメしたい、TED極上プレゼンテーション15選 – Photoshop VIP
http://photoshopvip.net/archives/39527

WEB屋にとって便利なジェネレーター色々!最近のオススメも、昔から使ってきた物もまとめてご紹介! | バンクーバーのうぇぶ屋
http://webya.opdsgn.com/introduceweb/generatorforwebya2012/

フリーランスと中小企業向けの超簡単オンライン見積書と請求書作成・管理・郵送ツール | MakeLeaps
http://www.makeleaps.jp/

タイポグラフィの素晴らしい世界をまずは無料のものから学んでみるebookのまとめ | コリス
http://coliss.com/articles/build-websites/operation/design/free-ebooks-for-typography.html

【Webデザイナ-・コーダー向け】すぐに使えるSCSS入門|基礎編 | クラスメソッド開発ブログ
http://dev.classmethod.jp/ria/web-desiner-corder-scss-tutorial/

PhotoshopでWebサイトのデザインをしよう | Webクリエイターボックス
http://www.webcreatorbox.com/tech/photoshop-web-design/

無料で大量の背景テクスチャをダウンロードできるサイト「Subtle Patterns」 – GIGAZINE
http://gigazine.net/news/20121009-subtle-patterns/

WordPress で Web製作をしたいけど、PHP はまだちょっと … という人の PHP ガイド
http://webdesignrecipes.com/php-programing-and-wordpress/

無料ダウンロードできる、素敵Photoshopブラシ素材40個まとめ 2012年10月度 – Photoshop VIP
http://photoshopvip.net/archives/39365

PHPのエラー箇所を分かりやすく表示してくれるライブラリ。デバッグ時にかなり楽できそう。 → PHP Error | error reporting for PHP – コメンター
http://cmmntr.com/t/aed3ecc96b15b947eab2efdf78a7b38d

全部、商用も無料!高級感のある細字のフリーフォントのまとめ | コリス
http://coliss.com/articles/freebies/freebies-best-of-thin-fonts.html

プログラマじゃなくても使える肩の力を抜いた勉強法「遅延評価勉強法とつまみ食い勉強法」の共通項 | 男子ハック
http://www.danshihack.com/2012/10/04/saku/tsumamigui.html

質感アップの隠しテクニック、無料ピクセルパターン素材70枚まとめ – Photoshop VIP
http://photoshopvip.net/archives/39237

ブロック要素の高さを簡単に揃えられるjQueryプラグイン「equalize.js」:phpspot開発日誌
http://phpspot.org/blog/archives/2012/10/jqueryequalizej.html

PCデザインの新しいカタチ「タッチジェスチャー」を意識したUIデザインのまとめ | Webデザインクリップ|Web制作に便利な情報を集めたまとめサイト
http://webdesignmatome.com/webdesign/touch-gestures

タグマネジメントツール「Google Tag Manager」についての紹介|コラム アユダンテ株式会社
http://www.ayudante.jp/column/2012-10-02/11-19/

厳選!高品質なのに無料で使用できるレスポンシブ対応のWordPressのテーマのまとめ -2012年版 | コリス
http://coliss.com/articles/blog/wordpress/free-wordpress-themes-for-responsive-of-2012-best.html

HTML5 × CSS3 × jQueryを真面目に勉強してみる – #4 LESS | クラスメソッド開発ブログ
http://dev.classmethod.jp/ria/html5/html5-x-css3-x-jquery-4-less/

全120種類、シンプルながら細部までしっかり作りこまれた商用利用無料のアイコン素材 -Application Icon Set | コリス
http://coliss.com/articles/freebies/freebies-application-icon-set-by-matt-gentile.html

レトロ・ヴィンテージなかわいいものからビジネス・リアルなものまで、クリップアートがダウンロードできるサイトのまとめ | コリス
http://coliss.com/articles/freebies/freebies-clipart-sites.html

5ヶ月で100万PVのブログを作成する為に実践した32の手順 | バズ部
http://bazubu.com/blogging-pv-9236.html

レスポンシブ・ウェブデザインでの CSS コードの書き方
http://yomotsu.net/blog/2012/10/01/mediaquery-goodpractice.html

CSS3+Retina時代のWeb制作で頻繁に利用するジェネレーターまとめ8つ – コメンター
http://cmmntr.com/m/38

Google Analyticsでサイトのことが丸分かりのバブルチャートをフル活用する方法 | nanapi [ナナピ]
http://nanapi.jp/48283/

さようならHTML5…。アメリカ人と日本人の標準化に差を感じる【連載:村上福之⑦】 |エンジニアtype(1/2)
http://engineer.typemag.jp/trend/2012/10/fukuyuki-html5.php

ウェブサイト高速化勉強会に参加してきた #tnmk0929 – Shinya’s Daily Report
http://d.hatena.ne.jp/absj31/20120929/1348929687

デザインを学びたい全ての方へ/海外のデザイン学習リソース200選 | サンフランシスコ・シリコンバレー拠点のクリエイティブエージェンシー・btrax スタッフブログ
http://blog.btrax.com/jp/2012/09/27/200-design-learning-resource/

直感的にスマートにモバイルアプリのUIが作れるモックアップサービス「fluid」 | DesignDevelop
http://design-develop.net/web/fluid.html

Photoshopをマスターする、すごいチュートリアル、作り方35個まとめ 2012年9月度 – Photoshop VIP
http://photoshopvip.net/archives/39124

[WP/JS覚書]カスタムメニューの子ページをJQueryでドロップダウン(アコーディオン)構造にしたい場合のtips – ponnao-clip

以前こちらの記事で、「wp_enqueue_script」を使ったスクリプトタグの仕組みについてざっくりと触れたのですが、今回設置時にうまくいかなかったこともあって、少し深めに調べてみたので載せておきます。

3.3からの仕様変更については、こちらの記事が大変詳しく書いてあって納得行きました。
WordPress wp_enqueue_scriptの仕様変更によってコンフリクトが発生している模様 | hijiriworld Web

まず、そもそもこの引数が追加された背景には以下の理由が挙げられます。

CSSはhead要素内、JavaScriptはbody要素の直前に記述した方が高速化する。

よって、現在のWeb標準からすれば、body要素の直前に記述(出力)した方がよさそうです。

これを理解してWordPressの仕様変更にきちんと対応しているプラグインはすでにそうしています。
一方、WordPress制作者がそれを知らないとコンフリクトを起こす可能性があるわけですね。

現状では、引数「$in_footer」を「true」と表記すると、スクリプトタグが前に出力される設定になっていますね。
またfooter.phpに直接記述しても、前に出力される設定になっているようです。

↓fotterに記述すると</body>の直前に記述されることを実証してくれてるページ
wp_enqueue_scriptの仕様がWordPress3.3でちょこっと変わったって話 | マイペースクリエイターの覚え書き

↓こちらは自作のjqueryを使ったプラグインが、ヘッダーでjqueryが呼ばれてないと動かないもので、3.3以降の仕様でscriptタグが</body>タグの直前に行っちゃって動かなくなった話。
wordpress 3.4 でwp_enqueue_scriptの仕様が変わった? « もみんぎゅぅ

wp_enqueue_scriptのスクリプトソース出力の表示する場所の検証

気になったので、上のことを踏まえて出力の様子について検証してみました。
直下フォルダを指定する場合と、テンプレートフォルダを指定する場合にも分けてます。

特に何も指定がないとWordpressファイルのURLパスが頭に付きます。

こんな感じで。

<script type='text/javascript' src='http://hogehoge.com/wp/js/functions.js?ver=1.0'></script>

◯header.phpに記述する場合

<?php wp_enqueue_script('functions','/js/functions.js'); ?>

◯function.phpに記述する場合

wp_enqueue_script('functions','/js/functions.js');

直下のフォルダ(例:js)を指定する場合の出力表示

なので、例えば直下のJSフォルダを指定したい場合は、http://から記述しなきゃいけないぽい。

<script type='text/javascript' src='http://hogehoge.com/js/functions.js?ver=1.0'></script>

◯header.phpに記述する場合

<?php wp_enqueue_script('functions','http://hogehoege.com/js/functions.js'); ?>

◯function.phpに記述する場合

wp_enqueue_script('functions','http://hogehoege.com/js/functions.js');

テンプレートフォルダを指定する場合の出力表示

例えばテーマで「vicuna」を利用してる場合はこんな感じ。

<?php wp_enqueue_script('functions','http://hogehoege.com/wp/wp-content/themes/vicna/js/functions.js'); ?>

◯header.phpに記述する場合

<?php wp_enqueue_script('functions', get_bloginfo('template_url').'/js/functions.js'); ?>

◯function.phpに記述する場合

wp_enqueue_script('functions', get_bloginfo('template_url').'/js/functions.js');

表示される場所

◯header.phpに記述した場合

<!-- WordPress general-template  start -->
<meta name='robots' content='noindex,nofollow' />
< !-- ココ --! >

◯function.phpに記述した場合

<!-- WordPress general-template  start -->
<meta name='robots' content='noindex,nofollow' />
<link rel="alternate" type="application/rss+xml" title="~省略>
< !-- ココ --! >

で、最終的に一番良さそうなのはやっぱりこれでしょうか。

◯function.phpに記述した場合で、自分の指定したjsフォルダへのリンクで前に出力する記述

wp_enqueue_script('functions','http://hogehoege.com/js/functions.js', array(), '1.0' ,true);

2008年あたりから知られていたようなのだが知らなかった~ハズカシ~
ただ組み方によってはclearfixでないと、うまくいかない場合もありますね。

clearfixを使わないでやるには。 – CSS HappyLife

clearfixするためにoverflow:hidden;を使って困ったことがある人へ|ふじこのプログラミング奮闘記

TREXTACY :: SPACEBALL RICOCHET: CSS スタイルシートメモ 「画像がはみ出る」件について。

画像がBOXからはみ出すときのCSS小技 | Centech

関連して「clearfix」についての見直し記事も載せときます。
[CSS覚書]clearfixの決定版 – ponnao-clip

main枠のoverflow:hidden;

今WPをカスタマイズするときによく使ってるvicunaテンプレートは、mainの中にentryが入れ子になってます。
この場合は、entryにoverflow:hidden;スタイルを付け足すと、最下部にフロート画像+短めテキストの形式が来ても、画像がはみ出さないで済みました。

通常サイトからWPサイトへの変換作業をやってます。
そのサイトは期間限定のページや、申し込みを閉めきったらクローズするページなどがあるので、今までもサイトマップの扱いが面倒だったのですが、このプラグインを使えば自動更新できるかも!と導入してみました。

ここで紹介されてる『PS Auto Sitemap』というプラグインです。
サイトマップを自動生成してくれるWordpressプラグイン | necozine

利点としては、固定ページの新規投稿や非公開操作に合わせて、こちらも勝手に更新されるということにつきますねー。

並ぶ順番は「順序」通り

20131203追記
サイトマップの並ぶ順番は、記事の「ページ属性」の「順序」に左右されます。
あらかじめ順番通りに並べておきましょう。
ちなみに自分は、あとから途中にも入れられるように、1、3、5、7、9と奇数並べにしてます。

プラグイン設定ページでサイトマップを表示する記事IDを入力

まず最初の設定として、PS Auto Sitemapの設定ページでサイトマップを表示する記事を入れないと表示されないよ。記事のIDを入れます。

本文の記述

サイトマップページに以下の記述を入れる

<!-- SITEMAP CONTENT REPLACE POINT -->

タイトルが短いと真ん中寄せにしたくなるので、その時はこんな感じで(ーー;
align centerだとテキストだけ真ん中になっちゃうので注意。

<div style="margin-left:100px;"><!-- SITEMAP CONTENT REPLACE POINT --></div>

トップページを手打ちにする場合

トップページの表示がサイト名そのままになってしまってヘンなので、設定から「ホームページの出力」のチェックをはずして表示させないようにして、最上部にトップページへのリンクを付けました。

<a href="トップページのURL">トップページ</a><div id="sitemap"><!-- SITEMAP CONTENT REPLACE POINT --></div>

ついでに、PS Auto sitemapのスタイルを採用した時でトップページを手打ちにしたときの全記述。
「付箋」スタイルで確認しました。他のスタイルだとおそらく ulのclass名が変わります。

<div style="margin-left:100px;">
<ul id="sitemap_list" class="sitemap_disp_level_0">
<li class="home-item"><a href="http://XXXXXX.com/">トップページ</a></li></ul>
<!-- SITEMAP CONTENT REPLACE POINT -->
</div>

自ページへのリンクは削除

また、サイトマップページにサイトマップへのリンクがあるとヘンなので「除外記事」項目にサイトマップ記事のIDを入れました。「サイトマップを表示する記事」項目と同じIDすね。

スタイルの選択

20120418追記
下にツリー型スタイルの導入方法も書きましたが、再び設置しようと思ったら、スタイルが結構入ってて、どれも良い感じ。
真面目なサイトであれば「シンプル」とか「ドキュメントツリー」とか、ちょっとくだけた感じのサイトだったら「蛍光ペン」とか「CUBE」とか好みです。
これだとツリー型の最下部の処理も気にしなくていいしね~。

ツリー型スタイルの導入

『PS Auto Sitemap』で出力されるソースはこんな感じ。

<ul id="sitemap_list" class="sitemap_disp_level_0">
<li class="page_item page-item-4"><a href="http://hogehoge.com/guide/">大会案内</a></li>
<li class="page_item page-item-6"><a href="http://hogehoge.com/place/">会場案内</a></li>
<li class="page_item page-item-8"><a href="http://hogehoge.com/course/">コースガイド</a>
<ul class='children'>
	<li class="page_item page-item-10"><a href="http://hogehoge.com/course/5km/">コースガイド~5km~</a></li>
	<li class="page_item page-item-12"><a href="http://hogehoge.com/course/10km/">コースガイド~10km~</a></li>
	<li class="page_item page-item-14"><a href="http://hogehoge.com/course/half/">コースガイド~ハーフ~</a></li>
</ul>
</li>
・・・

いつも使っているツリー型のCSSを、PS Auto Sitemapが吐き出すCSSに合わせて修正しました。

/************************************************
* Sitemap * 
************************************************/
div.sitemap {
margin-left: 50px;
}

ul li.home {
list-style-type: none;
}

ul.tree {
margin: 0 0 0 1em!important;
padding: 0!important;
list-style: none!important;
}
ul.tree ul {
margin: 0 0 0 1em!important;
padding: 0!important;
}
ul.tree li {
margin: 0!important;
padding: 0 0 0 16px!important;
background-image: url(blogimg/tree_lst.gif);
background-repeat: no-repeat!important;
list-style: none!important;
}
ul.tree li.tree_end {
background-image: url(blogimg/tree_end.gif);
list-style: none;
}

↓↓↓

/************************************************
* Sitemap * 
************************************************/
div#sitemap {
margin-left: 50px;
}

ul li.home {
list-style-type: none;
}

ul.sitemap_disp_level_0 {
margin: 0 0 0 1em!important;
padding: 0!important;
list-style: none!important;
}
ul.sitemap_disp_level_0 ul {
margin: 0 0 0 1em!important;
padding: 0!important;
}
ul.sitemap_disp_level_0 li {
margin: 0!important;
padding: 0 0 0 16px!important;
background-image: url(images/custom/tree_lst.gif);
background-repeat: no-repeat!important;
list-style: none!important;
}
ul.sitemap_disp_level_0 li.page-item-14,ul.sitemap_disp_level_0 li.page-item-170,ul.sitemap_disp_level_0 li.page-item-184 {
background-image: url(images/custom/tree_end.gif);
list-style: none;
}

手間取った点としては、
ツリー型ではリストのlastクラス指定でリストの一番下がL字型の画像になるのですが、PS Auto Sitemapで出力されてる場合、lastクラス指定ができないので、スタイルにリストの最後に来るページのIDを指定しないといけないです。

ul.tree li.tree_end {
background-image: url(blogimg/tree_end.gif);
list-style: none;
}

↓ ↓ ↓

ul.sitemap_disp_level_0 li.page-item-14,ul.sitemap_disp_level_0 li.page-item-170,ul.sitemap_disp_level_0 li.page-item-184
background-image: url(blogimg/tree_end.gif);
list-style: none;
}

この場合、この指定したページがページの追加などでリストの最後でなくなった場合は、当然修正しないといけないです。が、今回の場合は動かなさそうなページなので、ま、ま(^^;

類似プラグインなど。

プラグインを使わずサイトマップページを作る方法

お手軽WordPress Tips:プラグインを使わず、簡単なコードでシンプルなサイトマップを作成する – かちびと.net
何らかの事情でプラグインを使えない場合によいかもですね。
ここでもプラグインを使う場合はPSを推奨されてはいますが。

類似プラグイン:Dagon Design Sitemap Generator

利用したことはありませんが、ググってる時にいくつか見かけたのでメモ。
サイトマップ作成プラグイン Dagon Design Sitemap Generator | WordPressで企業ウェブサイト作成・商用ホームページ制作 WordPress Go Go

今使ってる「Google XML Sitemap」と併用した時に不具合があるらしい。
スラッグをかぶらせるといけないみたい。
サイトマップ作成プラグイン「Dagon Design Sitemap Generator」導入方法とその設定。(「Google XML Sitemap」と併用した場合) | うつしよ

「Dagon Design Sitemap Generator」 と 「Google (XML) Sitemaps Generator for WordPress」 を併用して使用した場合、「Dagon Design Sitemap Generator」 のページスラッグを 「sitemap」 にしてしまうと、サイトマップが表示されなくなるようだ。

解決法はあったのだがちょっとビミョー

WordPress › フォーラム » 投稿記事の編集中にスクロールバーが勝手に動く

ここの互換表示にするという事例が、WordPressのフォーラムなのだがMTにも当てはまったのです。

ただ互換表示を押すと勝手に再構築しはじめるし、記事の修正後に更新ボタンを押して再構築した後になぜか互換表示が解除されてしまう場合もあります。

解除されないときは、他のページが互換表示になってるときがある。
なので、更新ページを一緒に開いてたりすると、そっちが互換表示で崩れてて、一瞬うわーとか(^^;
あまり解決になってないです。

「埋め込みフォントを抽出できません」

現象
AcrobatreaderでPDFファイルを開いた時に、
「XXX(フォント名)がないので埋め込みフォントを抽出できません」
というメッセージが出て、縦書きのテキスト部分のひらがな及びカタカナが何故か消えている。

ちなみにAcrobatProffesionalでは問題なく見れました。しかし余計に混乱した・・・。

特定の PDF ファイルを開くと「埋め込みフォントを抽出できません」エラーが表示される(Acrobat/Adobe Reader )

まとめると、縦書きでフォントを埋め込みにした場合で、 10.1.1、9.4.6、8.3.1 のいずれかのバージョンで見ると、このエラーがでて、縦書きのテキスト部分がおかしくなるらしい。

「描画エラーが発生しました」

フォトショップを経由して、上のメッセージが表示されないように修正したのですが、今度はIEで開くと、「描画エラーが発生しました」と表示されるようになりました。
chromeだと問題なし。

pdfファイルを閲覧しようとするとエラー表示。 | その他(ソフトウェア)のQ&A【OKWave】

これはファイルサイズが大きいために出てきているような気がする。。

今回は自分が作ったPDFではなかったので、いずれも場合もとにかく、どんな環境でも見れるような方向に修正を重ねるしかないのですよね。
ちなみにフォトショップを介して、PDFを作成する場合はバイリニア法よりバイキュービック法の方が圧縮率が高いようです。

何の前触れもなくいきなり出ましたぜダンナ(^^;
このメッセージなのですが、クリーニング時に使う「廃インクタンク」が満タンというメッセージらしいんですよね。なので、根本的な方法は修理に出して廃インクタンクとやらを交換するしかなく、その費用が一万円以上はするというので、修理には出さず新しいプリンターを買う人が多いようです。
ここで説明するのは、とりあえずの処置になります。

taka ~勝手気ままな貧乏生活~ – Yahoo!ブログ

エラー番号 No.46[ブラザープリンターエラー表示別原因・対処法一覧【brother】]|インク革命.COM

上の通りにいかなかったので、説明をアレンジして自分で作ってみました。
実際に操作してる時の思い出し書きしてるのでちょっとテキトーな部分があります。ご了承下さい。

1.コンセントをはずす
2.15秒以上放置した後、「メニュー」ボタンを押しながらコンセントを入れる。
3.上下ボタンで数字が出る 8⇒OKボタン、0⇒OKボタンの順に押す。
4.モノクロコピーボタンを『PURGE:*****』と表示されるまで何回も押す。
5.2⇒OKボタン、7⇒OKボタン、8⇒OKボタン、3⇒OKボタンの順に押す
6.カウンターがリセットされて「PURGE: 00000」と表示される。
7.停止ボタンを押す。
8. ON、OFFボタンを押して電源を切る。
9. コンセントを外す。
10. コンセントを入れる。

急に数字が出てくるので、ダイヤルボタンなんてないよ!と思ったが、
数字は上下ボタンを押すとでてきます。
また停止ボタンを押しても何も起こりませんでしたが、とりあえずコンセントを抜けばよかったです。ほほほ。

そして、重要なのはここの部分。

だが、カウンターリセットをしても廃インクタンクは満タン状態なので、
使い続けるとインク漏れが起こる可能性がある。
廃インク吸収パッドの交換費用は、約10,500~12,600円だぞ。

上の方法は無理やりリセットさせてる感じですね。
これが出たらいずれにしろ次のプリンターを買う準備をしておいた方がいいのかもしれません。うおぁー。

呪文というか・・・(^^;
何度もやってはいるのですが、その都度忘れてしまうので
いずれかのスタイルシートで(import.cssでも、その他のcssでも)以下の設定をすればおK
自分はカスタマイズ用のスタイルシート(custom.css)の一番最初に入れてます。

a img {
	border:none;
}

Home > アーカイブ > 2012-10

MESSAGE
3月11日の東北地方太平洋地震で
被災された方、親しい方が被災された方に、
心よりお見舞いを申し上げるとともに、
被災地の一日も早い復興を
心よりお祈りいたしております。
PROFILE

横浜在住。
横須賀でWeb制作の仕事をしている
へっぽこ兼業主婦です。
ガチャピン似。


A RELATED SITE
くまのがっこうブログパーツ
TODAY’S COLOPLA COLONY
FAVORITE SHOP
RECOMMEND COMIC
【送料無料】しろくまカフェメロン味!

【送料無料】しろくまカフェメロン味!
価格:680円(税込、送料別)

【送料無料】なのはな

【送料無料】なのはな
価格:1,200円(税込、送料別)

【送料無料】昭和元禄落語心中(1)

【送料無料】昭和元禄落語心中(1)
価格:590円(税込、送料別)

【送料無料】テルマエ・ロマエ(4)

【送料無料】テルマエ・ロマエ(4)
価格:714円(税込、送料別)

TWITTER
POPULAR ENTRY
BOOKLOG

PONNAO’S RAKUTEN FAVORITE

YOUR’S RAKUTEN FAVORITE

Return to page top