ご無沙汰してます。ガッツリ制作シーズンに入った小杉です。

やー、レスポンシブサイトは Rootstrap を親テーマにして改造するとめちゃくちゃ速いということがわかりました。

それは置いといて。

 

文字列を置換できるプラグイン、Search Regex

/Everybody stand back/

Search Regex ってプラグイン。便利ですよね。

WordPress コンテンツ内の文言を検索したり、置換したりできるプラグインです。

公式サイト:WordPress › Search Regex « WordPress Plugins

ただ、更新が滞っているので若干心配ではありますが。

 

ローカル環境から本番環境に移行する際、エクスポートしたコンテンツのパスが変わるので、それを全部置換したいなと思って。

phpMyAdmin と FTP が使えない状況だったので、管理画面で何とかするしかないわけです。

ちなみに、ローカル環境からエクスポートしたデータはテキストデータなので、それを一括置換してからインポートするという方法もあります。

すっかり忘れてました。

 

まあ、そんなオッチョコチョイさんにもありがたいプラグインが、Search Regex です。

ありがたいんですが、カスタム投稿タイプに対応していないんですよね。

代替プラグインがあるかな〜?と思って探してみたんですが、見つからず。

そんなら、カスタマイズしてしまおうと。

 

ということで、ここからは自己責任です。OK?

中身なら、post_content.php を変えるだけ

plugins/search-regex/searches/ の中身が、検索対象を司っています。

その中に post_content.php があります。

10行目を以下のように変更します。

変更前

変更後

つまり、 AND post_type IN (‘post’,’page’) をカットしました。

カスタム投稿タイプに限らず、すべてを検索対象にしちゃえ!と少々乱暴ですが、意図としてはもれなく確認したいため。ひとつずつでも個別に置換できますしね。

 

同様に、タイトルの全置換は post_title.php かなって思いますよね。

ですが、ここには制限がありませんでした(笑)

タイトルは全部の記事を横断できるんじゃないかなと。

 

念のためバックアップをとっておき、ローカルで確認してから、本番の作業環境で実行しました。

特に問題なくガッと切り替わってくれました。オッチョコチョイさんでもチョチョイのチョイです。

良かったら試してみてくださいね╭( ・ㅂ・)و ̑̑

 

お好み焼きは主食派はい、ごめんください。
ちょっと質問されたけれどもすぐに解決できない割には需要があるなあと思ったのでメモしておきます。誰かプラグインにしませんか。

まず、現状は下記のとおりです。

  • お好み焼きの記事Aがある。
  • 卵焼きの記事Bがある。
  • 記事Aは「おかず」というカテゴリーと「主食」というカテゴリーに登録されている。
  • 記事Bは「おかず」というカテゴリーに登録されている。

そしてこの状態で起こりえる問題があります。

  • 「主食」というカテゴリーから、お好み焼きの記事Aを閲覧した。
  • 次の記事として、卵焼きの記事Bへのリンクが出現。
  • 確かに記事Aは主食でもありおかずでもあるが、「主食」のカテゴリーから来た以上、「おかず」のカテゴリーに属する卵焼きの記事Bへのリンクは許せない。

お好み焼きはそれだけで主食だと思うのに、卵焼きは主食か否か。や、私は主食でもいいんですけどね。

つまり、閲覧元のカテゴリーと同じカテゴリーの前後記事を表示する方法

閲覧元を調べてリンクを出すのはできましたが、そのまた次のページに行くなど、閲覧元のカテゴリーをずっと引き回すのがそのままではできなかったので、Cookie を使いました。

functions.php に下記を追加します。

下の方はフォーラムのkzさんの投稿がすごく参考になりました。

参考:WordPress › フォーラム » next_post_link:特定カテゴリーの除外について

 

そして、single.php のナビゲーション部分を下記のように変更します。位置としては while 〜 endwhile; の中ですね。

ざっくりとした概要

  • カテゴリーページに行くと、表示したカテゴリーIDをブラウザが保存(上書き)します。
  • 個別記事ページに行くと、保存されたカテゴリーIDと同じカテゴリーの前後記事を表示します。
  • ブラウザを閉じたりトップページに行くと、保存したカテゴリーIDは削除され、カテゴリーページを表示しなければ、時系列での前後記事を表示します。

できてしまえば単純でした。

We love WP!はい、ごめんください。
雪国新潟のウェブ解析士マスター、小杉です。

WordPress Advent Calendar 2013 の16日目の記事となります。

去年も個人ブログの方で参加しましたが、1年後に独立しているとは夢にも思っていませんでした。

今では WordPress を利用したサイト制作とウェブコンサルティングをやっています。アクセス解析ツールを見たりいじったりもしていますが、最近はウェブカウンセラーなんじゃないかと思い始めました。そんな私ですが、WordPress は今でも大好きです。

WordPress を個人で使っている方も多いと思うので、今日は Facebook と連携するときに知っておくとイイコトを記事にしました。

ちなみに、WP 成分は薄いです。

商品に「○○使用」と書いてあって5%くらいだったり、メロン味と書いてあってメロンを使ってなかったりするくらいの薄さです。スミマセン。

きっかけは、何気なく Facebook を眺めていた時。

FB友達の 笹川さん がブログをアップしたのを Facebook で見て、「ん?」と思ったのです。

Facebookの記事に作成者名?

なんぞこれ?

Facebookの記事に作成者名?

どうやらFacebook のウォールが新しくなった頃からのようです。本人のタイムラインなどには出てきませんが、メインのニュースフィードや埋め込み投稿にも表示されます。

↓このように、埋め込み投稿にも作成者名が表示されます。

 

↓ただ、はてなブックマークなどアプリ連携で投稿したものには表示されていません。代わりにアプリ名が表示されています。リンクを直接シェアしないと表示されないということがわかりました。

 

そこでフィードに流れてくる「リンクをシェアした記事」を見ていましたが、大抵ドメイン名が表示されているだけなんですよね。

笹川さんはライブドアブログとは思えない変態カスタマイズ(褒め言葉)をしているので、そのためかなと本人にお聞きしてみましたがお手上げ状態でした。

ソースを眺めたらすぐにわかった・・・けれど

HTML ソースを調べたところ、meta タグの name=”author” が該当しました。

Facebook との連携について調べてみましたが、解釈できるブラウザもないし、あまり意味がないからいらないよーという記事がたくさん見つかりました。

そんな記事に埋もれているのか、今回の件についての日本語の記事が見当たりませんでしたが、そのものズバリの英語の記事を発見しました。

参考:Optimizing Your Site for the Open Graph (UPDATED)

そのものズバリだ!

さっそく meta タグの name=”author” を入れてみた。

メールアドレスを入れることもあるようですが、今回は Facebook の投稿に作成者名を表示させることが目的なので、表示させたい文字そのものを入れることにしました。

ということで、<meta name=”author” content=”小杉 聖(@mekemoke)” /> などとヘッダに入れれば良いわけですね。日本語もOKです。

WordPress のプラグインで対応しているものはなさそう

Facebook との連携と言っても、OGP 設定とは違うので、プラグインで対応しているものはないように思います(ちゃんと調べていないので、もしあったらそちらで適用されているかと)。
私は WordPress SEO by Yoast を愛用しているのですが、特に設定項目はありませんでした。

そこで、手動でテーマを編集します。

管理画面の、[外観]>[テーマ編集]>header.php をいじるだけで行けます。プログラムも不要で、下記を <head> 〜 </head> に追記するだけなので1分もせずに終わります。

はい、終わりました。

追加したー!・・・けど、表示されない?

実際に表示されるかどうかは、「自分のみ公開」の設定にして Facebook でリンクをシェアしてみるとわかります。わかるんですが・・・どうにもこうにも表示されません。

しかも Facebook のデバッガで確認すると、エラーになっていました。

Facebookのデバッガでエラーが〜

The meta tag on the page was specified with name ‘author’, which matches a configured property of this object type. It will be ignored unless specified with the meta property attribute instead of the meta name attribute.

「meta タグで name 要素に “author” を指定してるみたいだね。でも、property 要素として扱わないと、無視すんよ?」と言われました。

はいスミマセン。OGP として設定しろってことですね。わかります。わかりますけどでもでもだって。

結論:適切な OGP 設定 + HTML レベルの著者情報で OK

OGP の詳しい説明は省きますが、ソーシャルメディアで連携する時にウレシイ設定です。

参考:これだけは知っておきたいOGP (Open Graph Protocol) | NEX.FM
参考:Facebookインサイト設定の落とし穴、app_id, page_id, admins の違いとは – Six Apart ブログ
参考:OGPに何書いたらいいか – MEMOGRAPHIX

結論から言うと、下記の設定を行なっておくことで作成者名は表示されます。

fb:admins もしくは fb:app_id は設定しておく

個人の場合は admins、複数人で更新している場合は app_id が良いようです。
これは片方でも両方でもOK。IDは調べて設定しましょう。

article:author もしくは article:publisher も設定できる

個人の場合は author に自分のFBページ、複数人の場合は publisher に FBページの URL を入れます。ちなみに、日本語版ではこの機能は反映されていないようです…(詳細は上記参考リンク)。
これはどちらか片方にしておきましょう。

私の場合、author と publisher の両方を設定していたことでうまく行かなかったようです。

このブログは個人用なので、fb:admins と article:author を設定しました。
自分の個人事業用のサイトは Facebook ページと連携させたかったので、fb:app_id と article:publisher を設定しました。

app_id の取得を別途しておけば、WordPress SEO by YOAST で fb:app_id と article:publisher をプラグインの設定画面から設定できます。

そして <meta name=”author” content=”作成者名” /> を追加する

追加する場所は <head> 〜 </head> ならどこでも良いようです。さくっといけますね。

というわけで、下記のように作成者を表示することができましたヽ(=´▽`=)ノ

注意点。

今回の流れで気になった点を4つほど。

自由度が高いけど虚偽表示はダメ、ぜったい。

著者表示は単純なドメイン名だけでなく、自分の名前を表示させることができます。

私もふと気づいたものだし、メインのフィードにしか現れないので「著作者が表示されるから、自分の名前を出して信頼を得よう!」とか声高に言うのは早計すぎるので、あくまで小技程度の紹介です。

ただ、自由度が高いので悪用されかねないなあとも思いましたが……、そうなったら Facebook 側で表示することはしなくなるだけでしょうね。

昔の記事に適用されるまでにはタイムラグがありそう

Facebook はデータをキャッシュするので、一度 Facebook でシェアした記事のデータは変わってくれません。OGP はデバッガで更新できるようですが、この作成者名については対応していないのかな?と思いました。

ただ、記事を書いている間に適用されたのを目の当たりにしたので、タイムラグがあるようですね。Facebook では、「自分のみ」の公開範囲で投稿して、全体のニュースフィードを確認してみると良いでしょう。

エラーが消えない

最初のきっかけとなった笹川さんの記事は、デバッガでエラーが出てこないのです。OGP 設定を合わせてみましたが効果なし。

無視するよーと言いつつ表示しているあたり、仕様のよく変わる Facebook のツンデレっぷりがよくわかります。そのうちなんとかなるのかも。

アプリで連携させない

アプリを介すとその情報が入ってしまうので、手動でシェアするようにしましょう。
せっかく書いた思い入れのある記事ですから、読んで欲しいポイントや気持ちを添えてシェアすると良いですよ。

いいね!ボタンだけでなく、シェアボタンを置いておくと楽かもしれませんね。

参考:Share Button – Facebook開発者

ウラ話。

なんていうかもう、WordPress <<< Facebook 的な記事でスミマセン。

実は WP のネタを考えているときに、

WP Test の日本語化とかやろうかなー → 公式が数日前にアップデート → orz
(参考:WordPressテーマユニットテストデータ日本語版を更新したよ! ‹ nuuno

WordPress SEO by YOAST の日本語化しようかなー → 最新版がんばってる方発見 → orz
(これは自分用にまとめました:WordPress SEO by YOAST を日本人が使いたい場合のメモ – NAVER まとめ

となっていてちょっと焦っていたのですが、WordPress 3.8 が出たという情報を振りきって、ムリヤリ WP にこじつけた感が…。

・・・ま、細かいことは気にしない!

明日17日は、あのプライム・ストラテジーの藤 祐太郎さんです!(実は誕生日が一緒だった!)

wp-seo-by-yoastWordPressを使った機械的な部分のSEOについては、もうこのプラグイン使っちゃえば、あとは別にいらないんじゃないかと思っている昨今です。

むしろオススメあったら教えてください。

参考:WordPress › WordPress SEO by Yoast « WordPress Plugins

Facebook でページをシェアする時に表示される画像の話です

Facebook とかでシェアする時に、サムネイル画像が表示されるのを見たことがあるかと思います。あれは、「このURLの画像を使ってね〜」と教えてあげると、それらを参照します。(og:image として設定します)

でも Facebook は 1,500px だか 2,000px だか(どんどん大きくなってる)を推奨しているので、小さい画像だと無視されちゃって、ページ内の他の画像をサムネイルとして使ってしまいかねない場合もあります。

Facebook はちょこちょこ仕様が変わるのですが、「また変わるのー?勘弁してよー!」と思うより、「ああ、解像度のめちゃ高い画面に最適化しようとしてるのね〜。時代がそうなっていくのを見越してるのね〜」と思っていたほうが精神衛生上お勧めです。

WP SEO は OGP タグを自動的に出してくれるのですが

さて、本来ならその元画像を og:image として設定しておけば、投稿内の画像をサムネイルとして使うことができるようになります。

手作業でやるのはちょっと面倒なので、WP SEO を使うと、投稿内にある画像を og:image として自動的に設定してくれます。何も考えなくて良いので嬉しいですね!

ですが、元々の画像は大きくても、表示するために小さめの画像(中サイズとか)を設定している場合があります。これが問題。

元画像を og:image に設定できる方法はないものかな?
ってことで、プラグインの中身覗いてみました。

WP SEO でフルサイズの画像を og:image として設定する方法

本題です。

WP SEO を有効化しているという前提で、下記を functions.php にコピペして保存すればOKです。

久しぶりに PHP いじったので、変な書き方だったらご指摘ください。英語はわかればなんでもいいです。

何をやってるかというと、WP SEO では og:image を出力する時に、一旦 content を参照してイメージタグを取得しているのですね。その content で使っている画像の、元画像ではないファイル(-300×240とかついている画像)のサイズ指定部分を取っ払ってから読み込ませているわけです。

直接プラグインをいじるより、フックしたほうが安全なのでこれで実現できました。

・・・うん、まあ、動かなかったら該当ページ教えてください。改良してみます。

画像がでなかったり、シェアする時におかしかったら?

Facebook でシェアするときとかに「サムネイルがちゃんとでなーい!」「何か変!」という場合には、下記のページにURLを突っ込んで、確認すると良いですよ。ここでキャッシュさせると表示されるよーって話も見かけました。

参考:Debugger – Facebook Developers

12. 11月 2013 · 2 comments · Categories: WEB制作 · Tags: ,

やばーい!となる前に。ちょっとアメブロからの移行をお願いされたのですが、その期間に色々考えることがありました。

やっぱり、私の周りでもアメブロ使っている人多いです。FC2はあまりいないのですが。

前からずっと言われていることなのですが、どうして商用で無料ブログを使っちゃいけないのか、ということを書き連ねてみました。言いたいことは最後の一文です。

ちなみに、サービスを妨害しようという気はありません。使っている方を卑下する気もありません。そもそも個人で使ってる方は、楽しそうで何よりです。

ただ、「ああ、やっぱりもったいないよね。そうだね。何とかしたいな」と思っていただければ嬉しいです。

よくある理由1:SEOが不利

アメブロの場合、URLが http://ameblo.jp/(アカウント名)/ という形になっています。

Googleは、同じドメインの記事を多くは出さない傾向にあります。今回の場合、ドメインというのは ameblo.jp の部分です。

そのため、検索したキーワードによっては、このドメインの制限を理由に、自分のブログが表示されないという事態に陥ります。

何が問題なの?

ここで何が問題かというと、自分自身の努力ではなかなか表示させることができないという点です。希望するキーワードで来て欲しいのに、表示させたくても表示されないのは、通常のSEOより困難です。

アメブロはすでに何千という記事を書いている人もいますから、一部では参入障壁が天高くそびえています。
そういう場合には、独自ドメインでがんばったほうがずっと楽です。

ただ、例外もある

FC2では http://(アカウント名).fc2.com/ となるので、(アカウント名).fc2.com の部分がドメインになるため、個々のブログが掲載制限にかかることは(今のところ)ないと考えられます。

FC2のようなサブドメイン型のブログサービスは、ここで言われている内容とは(今のところ)無縁ですね。

また、別のキーワードならすんなり上位表示するという状況も十分ありえます。

「うちはニッチなサービスだし、そんなにお客さん来なくてもいいから十分」と、現状に満足されている方もいらっしゃるでしょう。だって、店舗名でなら表示されるんですもんね。

時々、「○○というキーワードで1位に表示!」となっていても、それはその人のパソコンだけで、他の人が検索したら次のページだった、ということもありえます。(パーソナライズ機能というものです)

よくある理由2:商用利用が禁止されている

商用利用厳禁!?アメブロは商用利用が禁止されているからやめとけ!というのはよく言われます。私も言ってました。

下記は2012年10月の記事ですが、どうやら「やりすぎなければ大丈夫」という状態のようです。

参考:アメブロの商用利用は禁止なのか? 公式に確認してみた | Web担当者Forum

何が問題なの?

グレーゾーンだという事はもちろんですが、出る杭は打たれます。雉も鳴かずば撃たれまい。そんな状況。

グレーというのは、ブログからご自身のサイトに集客するのはアリですが、ブログをサイト代わりにしているのはNGです。つまり、アメブロで完結している場合は、消されても文句は言えません

だから「お金がなくても大丈夫!」「アメブロだから無料だよ!」と謳ってるようなところが、今後心配でなりません。特に、ママさん向けの起業とか、よくわからない人が「それだけやっときゃOK!」みたいに言われていたら……

「うちみたいな小さなところは大丈夫でしょ?ばれないばれない♪」っていう人は、利用規約に反していることを承知のうえで、消される覚悟ができてるんですか?と問いたい。

何より、お客様に迷惑がかかるということをもう少し自覚して欲しいと思います。

例外があるとしたら

上記の記事を元に考えると、公式サイトへの流入源としての利用は認められています。ただ、それが活用できるかどうかは別問題。

よくある理由3:独自ドメインが育たない

Curious leafホームページは持っていないけど、アメブロはやってる。という人は、先に上げたとおり辞めたほうがいいです。

というわけで、ホームページを持っているけれど、メインはアメブロ、という人。

これはプロバイダの無料スペースにホームページを持っていて、更新がうまくできないからアメブロでやってる、みたいな状況でしょう。
百歩譲って、これなら利用規約に(白に近いグレーですが)反しているとは言いがたいので、目を瞑ってもらえる可能性は高いと言えます。

ただ、わざわざ独自ドメインでホームページを持っているのに、無料ブログをやっている人は考え直したほうがいいです。

何が問題なの?

条件は上記と一緒なので、違反だなんだということは重要ではないのですが、思い入れがあるはずの屋号(独自ドメイン)が育ちません。

つまり、自分のホームページが無料サービスより下に格付けされている状態です。

現実では、いつか自分のお店を持ちたいな…!と思っている人は多いと思います。そのお店を持ったのにも関わらず、ライバルもひしめくテナントを間借りしている状態です。

せっかくお店を持ったのだから、そっちにお客さんを呼んで、どんなお客さんが来ているのかを把握して、ちゃんとおもてなしできるようにしておくべきではないでしょうか。

例外があるとしたら

無料ブログをメインにせず、集客ツールとするべきです。

たとえばサイトに設置したブログを更新したら、無料ブログにはサイトを更新した旨の記事を書きます(もちろん手動で)。これはFacebookページの使い方と同じですね。

面倒だ、意味が無いと思うなら、統合してしまえばいいのです。
でも、集客の効果を感じているならやってみて損はないでしょう。

それでホームページに来てくれれば、サービスに興味を持ってくれている証拠でしょうし、そうでなければ、ただの冷やかしです。そんな冷やかしのためにブログ書いてたって仕方ないでしょう。(アメブロはアクセス数が水増しされてるという話もあるので)

忘れそうなのでここら辺でもう一度書きますが、ビジネスで無料ブログを使った場合の話です。個人利用なら楽しくて良いと思います。

よくある理由4:バックアップができない

FC2はできるようですが、アメブロはできません。記事を消されたら完全抹消です。どうにもなりません。

アメブロがちょっと特殊なんですが、「みんながやってるから」「かわいいから」という理由で選ばれるのでしょうか。ピグとかもあるのかな。

たまに言われる理由1:情弱っぽい

Who's been using my phone?情報弱者っぽいというか…ここまで書いてたらそのものな気がしてきました……。

結局、ネットの世界において無知は罪なのです。

「だって誰も教えてくれないし!」という人が増えてしまったのは、ネットのインフラが急激に発展して、追いついて行けない人が多いからでしょう。

近年の行動パターンとして「商品を買うときはまず検索から入る人が多い」と言われているにも関わらず、「自分で調べることができない」という人が多いのが不思議ですね。

検索力さえあれば何とかなると思ってますが、ことネットの事になると「見てもよくわからない」と放棄してしまう人が多いのですね。

そのために、解析ランチというものを開催しています。ネットに関するなんでも相談所です。今更ながらの事でも大丈夫です。現状の相談でもウェルカムです。

たまに言われる理由2:解析がしにくい

ちょっと専門的になってきましたね。だからたまに言われる理由です。
ご自身のサイトならいろんな情報がわかりますが、外部サービスだと取りたい情報が取れません。

そもそも、「取りたい情報」が定まっていない場合がほとんどなので、よくわからずに無料ブログを使っちゃう状態とも言えそうです。

根本的な理由:要するに本気じゃない

Another view of Nermal on the laptopそもそも無料のサービスを使うということは、できるだけ消費を抑えたいという気持ちの現われなので、投資という考えはないのですよね。

これは無料ブログに限ったことではなく、一般的なホームページにも当てはまります。

なので、無料ブログを辞めました!独自ドメインでホームページやってます!

・・・だけでは、実は大して変わりません。

大事なことなのでもう一度言いますが、今回の話題はビジネスでブログをやっている場合の話です。

ということは、サービス利用費用等の見えるコストがかかっていなくても、人件費という目に見えないお金が関わっています。

そして(あまり向き合いたくない話かもしれませんが)ブログやホームページは、営業マンとしてお金をいただくことのできる可能性が十分にあります。

  • なんのために(ビジネスで)ブログをやっているのですか?
  • そのブログにかけた時間で、お客さんを呼び込みたくはないのですか?
  • 時間やお金を投資したいと思いませんか?

・・・そんなことを思うのです。

もうちょっと金臭い話を(オブラートに包んで)すると、

  • 毎月いくら稼ぎたいですか?
  • どのくらいのお客様にお世話になれば良いですか?
  • そのために、ブログやホームページができることはなんですか?
  • どれくらいのアクセスがあればいいと思いますか?

と、目標から掘り下げてみると現実が見えてきます。

もちろん、現状のビジネスでネットの役割がほとんどないということもありますので、一概に「ホームページ頑張りましょうよ!」とは言えません。

私はネットを大事にしないと生きていけませんが、リアルのつながりで事業を営んでいる方も多いです。というか周りはほとんどそんな感じです。

そんな中でもインターネットを活用していかないとだな〜と思われている方は、呑気に無料ブログなんてやってる場合じゃないんです。

 

はい、言いたいことは最後の1文だけです。

大事なことなので、言い回しを変えてもう一度。

ネットでお仕事を広げていきたいと思っている方は、呑気に無料ブログなんてやってる場合じゃないんです。

 

ameblo2WPコスギスの方に書くようなネタでもないので、こっちに投下。

結論から言うと、ひじょーに使いにくいしこれで有料ツールなのかっていうと首を傾げざるを得ないのですが、コツ(癖)さえ掴めばなんとかなりそうなので、メモ。

1.リスト全取得→画像も取得→MT形式にエクスポート(画像へのリンクは切る)

画像へのリンクが残っていると、結局リンク先が変わるので切っておく。

それでも残ってしまうのはあるのだけど…。

あと、取れない画像があるようですが、今回は大丈夫そうでした。体験版で取れない場合、おとなしくFC2を使ったほうが良いと思います。

2.WPにインポートする前に、必要な物は全て置換する

まず、絵文字はサイズの小さいgifとpngなので、テーマフォルダにでも突っ込んで、パスを正規表現で置換。

過去の絵文字形式のものは、[]の部分を<>に変えておけば表示はされない。

写真等はメディアからアップしておけばいいけれど、大きい物はもうサイズ変更しちゃってからアップして、フルサイズにしたほうが楽。
なので、画像のサイズ指定は置換してすべて取っ払っておく。

フォントサイズが入り組んでいる場合は、3はカット、2以下は83%、4以上は125%とかにしてしまう。

strongとspanをくっつけちゃったけど、閉じタグの関係でfontはすべてspanに置換したほうが楽。

中身が空のタグは、対応できる記事数じゃなければ、見なかったことにしておいたほうが精神的におすすめ。入り組んでなければ正規表現で置換してしまえばOK。

<p>タグは残しておいたほうが良い。もしくは、よくわからない改行は置換してしまう。<br>に頼らない方が良かった。

正規表現使えないと、置換は非常に大変です。

3.mt.txt をインポートして確認する

MT形式のインポートには専用プラグインがあるので、それをインストールしてインポート。

インポート自体はすぐに終わりますが、問題は内部リンクがあった場合…リンク先全部変わってるので。

4.リンク先を変えるのは手作業を覚悟する

ここが一番苦労するところ。カテゴリーへのリンクなら Search Regex とかのプラグインで一括置換できるけれど、過去の記事へのリンクとかが手作業で入っていると、泣けます。

ほとんどのリンクが「こちら」とかでリンクされていて、その先が想像できないと尚更です。

そんなわけで、深夜作業で音楽でも聞きながら、目視確認ついでに編集していくのがオススメです。1記事につき、1〜3分くらいかな。

 

というわけでザックリメモでした。

FC2通すと楽ですよ〜とは聞いたんですが、上記のことどこまでやってくれるんだろう?

やさしいGitHubはい、ごめんください。雪国新潟のウェブ解析士マスターですが、制作もやってる小杉です。
というわけで?先日の土曜日7月6日、デザイナー向けのやさしい GitHub についての勉強会に出席しました。

参考:第32回勉強会(2013/07/06) Githubハンズオン – 長岡 IT開発者 勉強会(NDS)

NDSというのは、長岡の開発者が集まって隔月で勉強会などを行なっている会です。
私は存在自体は知っててMLにも参加しているのですが、内容がプロフェッショナルすぎてついていけないというのが正直なところで、ずっと ROM でした。

そんな折、今回のデザイナー(≒開発初心者)向け GitHub の使い方の勉強会が開催されるということで、喜び勇んで参加表明!

そもそも Git を「ジット」と読んでた初心者でもわかった内容

まちなかキャンパスで開催された今回、参加者は満員でした。それでもやっぱり開発者が多かったようで、しかも新潟から来られた方がかなりいました。
具体的な進行状況については、ハッシュタグでまとめられたツイッターの発言があるので、そちらを参照してみると状況がわかるかと思います。

第32回長岡IT開発者勉強会 feat. Niigata.scm 「GitHubハンズオン」 – Togetter

私が一番最初に衝撃を受けたのが「Git」を「ギット」と読むこと。だって「Gif」は「ジフ」じゃないか!デザイナーなら間違うわ!と心で叫んで自分を納得させつつも、「ギットハブ」の使い方を習いました。

GitHub アカウントはすでに持ってて、Gist(ならこれは「ギスト」ですね。わかります。)でコードを上げてた時代がありました。
でも GitHub の使い方自体よくわからなかったので、勉強して使えるようになりたいというのが今回のマイ目的でした。
あとから、この Gist についても聞けばよかったなーと反省(途中で思い出したんですが、景虎梅酒でどうでもよくなりました)。

今回の勉強会の目的

「SourceTree を使ってバージョン管理のスタート地点に立つ」

会場は Windows 環境での稼働に四苦八苦。インストールはできても GitHub との連携がうまく行かなかったようです。どうやら、インストールする時にオプションで選ぶ必要があったとか?会場は林檎率が高かったんですが、高野さんのフォローで窓な皆様もすすめることができました。

最初はちょっと用語解説を含めた内容です。

  • VCS = バージョン管理システム(Version Control System)
  • SCM = ソフトウェア構成管理(Software Configration Management)
  • Git = VCSを行なうためのツール
  • GitHub = 一緒に作業する人とのコミュニケーションツール
  • SourceTree = GitHub をパソコンで扱えるようにするソフト(GitHubだけじゃないけど)

こんな内容を15分ほど。
あとから出てくる用語はハンズオンの中でその都度説明って感じでした。やりながら覚えるって良いですね。

  • リポジトリ = 管理したいデータの単位(ファイルとかプロジェクトとかサイトとか)
  • クローン = GitHub のリポジトリをパソコンにファイルとして展開する
  • ステージング = コミットするファイルを選択
  • コミット = GitHub 側のリポジトリに送る
  • プッシュ = GitHub 側のリポジトリで反映(≒ パブリッシュ)
  • コミット = ローカルの Git リポジトリ(≒クローンした作業コピー)に送る
  • プッシュ = GitHub 側のリポジトリ”に”反映
  • ブランチ = 別の作業をするための環境(あとで結合できる)
  • フォーク = 誰かの作ったリポジトリを弄れる
  • プルリクエスト = 弄った内容を送りつける

・・・と判断していますが、間違ってたらツッコミください!(最後の方になるにつれてややヤッツケ)
(21:00 修正:@masaru_b_cl さん、ありがとうございます!バッチリ微妙なとこでした(^_^;))

GitHub で “ホームページを持つことができる”(GitHub Pages)

特定のリポジトリ名を設定すると、自分のページを持つことができます。この辺が、「Git をコミュニケーションできるツール」らしいですね。

username.github.io リポジトリを作成すると、http://username.github.io/ で公開できるとのこと。今回もこの方法で行ないました。
大学時代に初めてホームページを作ったことを思い出しながら、十年以上前とのギャップに感慨深いものを感じていました。今って何でもできるなあ。

軽くトップページと自己紹介ページを作り、先述の内容はひと通り網羅した感じです。隣は WordBench 新潟のGさんだったので、遠慮なく衝撃画像をアップさせていただきました(ドヤ顔)(迷惑行為です)

GitHub を使うと幸せになれること

「バージョン管理ができる」っていうのは、「ああ、何やったかわかるからいいよね」くらいにしか思っていなかったのですが、実は「効率化」につながることを知りました。

今までは、「ちょっと違うことやってみよう」という場合、

  1. ファイルを別名で複製して、
  2. 元のファイルを保存しておいて、
  3. 複製したファイルを弄って、
  4. そして「いつか使うかも」というファイルが増える

という状態だったのが、Git を使うといつでも過去の自分に戻れるので、

  1. (Git で)ちょっとこのファイル弄りたいな
  2. (Git で)ブランチ作る
  3. パソコン上にその作業環境を「再現」
  4. 作業して Git に反映

ということで、Git 上では過程を確認でき、パソコン上ではその課程の状況を再現することができるので、(よくわからない)余計なファイルがいらなくなる!
ファイルが物理的に存在するものではないという何かよくわからない価値観が、派手に音を立てて崩れました。

実は画像のバージョン管理もできるという Git。ということは、デザイナーも十分に使えるものです。ウェブデザイナーなら使って損はないものでした。

そして懇親会で勢いづきました

NDS は開発者の集まりなので、懇親会でも Ruby とか Scala とか「ああ、聞いたことはある、聞いたことはね!」という言葉が飛び交っていたのですが、LT で Facebook 広告についての食いつきがすごく異常だった(ように見えた)のと、別に開発者向けでもなくて良いということなので、懇親会で主催者の @civic さんに

「Google アナリティクスの話したいです!」
「いいですよ」

と、即決いただいたので、11月頃に登壇させていただきます。内容は、GA(Google Analytics)を使う前にチェックしておきたいこと、あたりかと。
目的は、GA をただのモニタリングツールにするにはもったいない!と思ってもらうこと。カスタムを知ったらすさまじく改造しそうな方々ばかりなので、その辺は私がちゃんと把握できるようになったらやりたいですw

WordPress › Improved Page Permalinks « WordPress Plugins

はい、ごめんください。

WordPressで「ページの」パーマリンクを変更したい場合は、「.html on PAGES」を使っていたのですが、ページの構造が複雑になってくると、親ページはスラッシュ(/)で終わらせて、子ページは .html で終わらせたい、という要望が出てきます。従来のホームページのURLを変えたくない場合などには頻出するのでしょうかね。

そんな時に救世主になった(と言うより単純に私が知らなかっただけ)プラグインがありました。

WordPress › Improved Page Permalinks « WordPress Plugins

このプラグインの何が嬉しかったって、子ページがなくても親ページとみなし、スラッシュで終わらせることができる点です。つまり、スラッシュ(/)で終わらせるか「.html」をつけるかを設定することができるんですね。

特定のプラグインが重宝しているからといって、そればかりに束縛されるのは良くないと反省。

Anchorはい、ごめんください。
前に使ったことがあったのに忘れてしまって、使いたい時に使えなかったのでメモメモ。

WordPress 3.5 以降から、左側のメニューからリンクが消えました。

以前からリンクの機能を使っていて、バージョンアップされているかたは問題なく表示されていますが、新規でインストールすると消えています。

ちょっとしたバナーの管理とかしやすかったんですがね。

プラグインを使わなくても function.php に1行書けば一発 OK

リンク機能がなくなった!でもこのプラグインを入れればOK!というものはあります。それが Link Manager というプラグイン。
公式プラグインなので、検索してインストールすれば OK です。

ただ、プラグインのソースを見てみると・・・

link-manager.php in link-manager/trunk – WordPress Plugin Repository

・・・実質一行!!

というわけで、下記の一行を function.php に入れておくだけで、リンク機能を使うことができます。要するに、機能は存在しているものの、それを表示していないだけなのですね。

表示されていないということは、今後そのまま消滅する可能性があるとも言えます。その場合はカスタム投稿タイプを利用して、リンクを管理すると良いでしょう。

カスタム投稿タイプは難しそう…と敬遠している方は、これこそプラグインを使って管理すると良いでしょう。

WordPress › Custom Post Type UI « WordPress Plugins

私は他に投稿タイプを使う予定もなかったので、しばらくはリンクの機能を復活させて使います。

Money Holeはい、ごめんください。
先日税務相談に行ってきたので、その内容をまとめました。

税理士さんと直接話のできた良い機会で、私にとっては目から鱗がボロボロだったんですが、税理士さんにとってみたら「今までずっとサラリーマンやってきたんだから無理ないわよ〜」と何度も言われるほど、常識だったという話です。

誰かの常識は、誰かにとっては価値があるもの、という典型例ですので、知っている方にとっては「今更!?」という内容だと思いますが、もし起業を考えている方の参考になれば幸いです。

ちなみに私は経理に関して、まったくのド素人(以前は「償却」や「控除」の意味もよく理解できてなかった)でした。そんな私でも起業できるんですから、すごい世の中ですねえ。

そもそもの「経費」の考え方

いくらドシロウトの私でも、さすがに 売上 ‐ 経費 = 利益 という式は知っています。

給料は経費になりますが、個人事業主は給料という概念がないんですよね。
事業のお金を個人的に使いたい場合は「事業主貸」となります。逆に、個人のお金を事業で使う場合には「事業主借」になります。利益が増えたら法人化して、給料という形で経費にすれば良いのでしょうが、まだまだ先の話です。

そんなわけで毎日の生活の中でどこまでが「経費」になるのか、フリーランスでは非常に曖昧です。

私の場合は事務所を借りることができたので、光熱水費は自宅と完全に分かれていますが、例えば、事務所のご近所さんに挨拶回りをした際に買ったお菓子などは経費になるのかな?という「なくてもなんとかなるんじゃないか?と思われる部分」がわかりませんでした。

結論は「事業を起こしたから掛かるもの」=「経費」という考えに

つまり、仕事でなくても掛かるものは経費にはならないというわけです。
例えば、下記は経費と考えられます。

  • 事務所に置いた観葉植物(事務所を借りなければ掛からない)
  • 事務所のご近所さんの挨拶回りに買った菓子折り(事務所を借りなければ掛からない)
  • 仕事のために着るスーツ(仕事のために使うわけです)
  • 昼時の商談をするために食べたランチ(仕事の話をするために食べてます)
  • 事業に関連する書籍(仕事のために買った本です)
  • インターネットや電話の通信費用(按分が必要になる場合もあります)

下の4つくらいが、ちょっと嬉しい部分じゃないかと。パワーランチって良いですね (*´ω`*)
ネット関係の仕事をしていると、通信費はほぼ経費として考えることができます。スマートフォンをプライベートで使うことがほとんどないと、もう100%としたいところですが、他人からしたら「いやいや、100%はないでしょ」と突っ込まれることがあり得るので、だいたい9割くらいで申告することが多いようです。

正直なところ、経費かどうかは自分しか判断できないということでした。そこは常識の範囲内で申告すればOKです。自分がこうです!と言い張っても、他人に「普通の人もやってるでしょ?」とツッコミが入らなければ経費と考えられますので、例えば、下記は経費と言うには無理があるものです。

  • 仕事するから使うようになった化粧品(毎日化粧するでしょ?)
  • 歩いて通うようになったので買ったシューズ(仕事でなくても履くでしょ?)
  • 事務所で食べるお昼ごはん(普通にみんな食べるでしょ?)

こうして見てみると、専業主婦でもやるものは経費にならないという判断基準が自分には一番合っているかもしれません。

赤字になると経営破綻の他に問題が?

Red post-it label, calculator and ballpen

売上より経費が高ければ、当然赤字となります。赤字になると何が悪いのかといえば、銀行からの融資が受けられなくなったりします(要するに信用問題ですね)。お金を借りているわけでもないので、他に何かリスクがあるのでしょうか?

ということを聞いたら、単純に「生活できないでしょ?会社続けていて大丈夫?お客さんにも迷惑かけると大変でしょ」という心配くらいだとか。結局、運転資金が底をついたら経営できなくなるので、事業をたたむしかない訳ですね。

毎月の経費がある程度落ち着いても前年度の所得税がドカーンとくるので、少なくとも最初の1年間の資金面は、かなり厳しくなります。でもそれはみんなが通る道と割りきって、個人事業主としては、赤い数字を見てもやる気(モチベーション)をずっと保っていられるかどうかが鍵になりそうです。

フリーランス1年目の節税?

そもそも、税金は「利益(=所得)」に掛かってくるものです。経費のほうが大きくなりがちな期間(開業したての1年間とか)は、節税よりも売上を上げることに注力しましょう。

利益が出た場合に考えるチェックポイントは以下のとおり。

  • 年間の利益が 38 万円以下だったら基礎控除で対応できる(税金かからない)
  • 年間の利益が 103 万円以下だったら基礎控除+青色申告で対応できる(税金かからない)

「控除」= いわゆる「所得控除」のこと

所得の年間総額から定額を所得税や住民税の対象外にできる = 所得の一部に税金がかからないことです。

基礎控除は、青色でも白色でも年末に確定申告を行えば、38 万円が控除されます。
プラス、青色申告(複式簿記)で申告すれば、65 万円が控除されます。

つまり、1年間の利益が 103 万円までは、所得に対する税金はかかりません。

「償却」= いわゆる「減価償却」のこと

長期に利用できる設備(≒資産)の費用を分割して経費とすることです。決まった期間+割合で計上する場合と、変動する割合で計上する場合があります。

開業費(開業準備費用)は償却できるということを初めて知りました(開業費=今後仕事をしていくにあたって必要な経費=長期に利用するためにかかるお金 と判断)ので、償却して調整することができるわけですね。

例えば、開業費として50万かかったとして、それ以外の経費で考えてみましょう。

  • 利益が 103 万円だった → 今年は開業費を償却しないで持ち越し
  • 利益が 153 万円だった →  開業費 50 万円を経費として換算 = 課税されない
  • 利益が 123 万円だった → 今年は 20 万円を償却 = 課税されない

償却期間は原則として5年以内です。20万→15万→10万→5万 とすれば4年で償却できますね。

ウェブ関係で起業したいと考えている方へ

ざっくりとで良いので、年間の事業計画書を作ってみてください。せめてこれくらいはできないと、後が大変です。

収入の項目として、どんなものがあるか。できるだけ確度の高いものを意識してください。そして、支出の項目も出来る限り挙げてみてください。だいたいは下記のようなものがあります。

  • 事務所等賃貸費用(借りる場合)
  • 光熱水費(自宅の場合は現状からどれくらい使うか考える)
  • 通信費(仕事で使う分の割合も把握)
  • 交通費(駐車料金も馬鹿になりません)
  • 印刷費用
  • レンタルサーバー料
  • 会場費(会場を借りて何かする場合)
  • 広告費(チラシやプレスリリースにどれくらいかかるか?)
  • 書籍・ソフト購入費用(必要毎月購読するものとか、必要になりそうなものなど)
  • 会費(有料会員の会費など)
  • 開業費(備品を揃えるためのもの)

経費としては掛からないけれど、把握しておきたい出費は下記のようなものがあります。

  • 健康保険料
  • 所得税(前年の所得で計算されます)
  • 医療費(持病がある人は特に)
  • 食費等の個人的な出費(仕事始めると意外と盲点です)

あと、自社サイトに手を掛けるためなどの内製(持ち出し)工数も把握しておくといいですよ。

こうやって出すもの出して眺めた時に、利益の目処が立たない場合は、焦ることはないんじゃないかと思います。気持ちが強いなら、今いる会社を説得するという手もあります。逆に説得できるくらいのスキルがつけば、営業活動も楽になるのではないでしょうか。

なんだかんだ言っても、「縁」だと思う

私の営業活動範囲はまだまだ狭いですが、色々な人とつながることで徐々に広がっています。ありがたいことです。こういう「縁」があることもひとつのタイミングを測るものではないでしょうか。自分一人でできることなんて、大したことないですからね。

お金の事は、必要な事は知っておくべき事として。先に挙げた計画の「方向性」(だからザックリで良い)を確認しながら、儲けてやる!と考えるよりも、どんどん活動していこう!と考えると、自然と仲間が増えていって、自分がやるべきことややりたいことが明確になります。活動の中で計画を修正するのも十分アリでしょう。

やらないとわからなかったところも多いです。そしてまだまだ知らないことも多いです。今まで苦手意識で手を出していなかったことを、必要に迫られたら何とかなると知って、むしろ仕事以外の新しいことを知るのが楽しい毎日です。簿記って取っておいて損はない資格かも。

上記の内容が間違っている、こうするといいよ、というご指摘は、ぜひコメント欄にお願いします。