【WordPress】リンクにnofollowを自動挿入『WP Nofollow Post』

どうもこんにちは、よっしーです( ˘ω˘)

 

外部にnofollow無しでリンクするとリンクジュースが失われてしまう…。

そこで困っているあなたに。

今回はWordPressでリンクにrel=”nofollow”を自動的に挿入してくれる「WP Nofollow Post」についてお話したいと思います。

 

WP Nofollow Postって?

WP Nofollow PostはWordPressの投稿や固定ページに貼ったリンクに自動でrel=”nofollow”を挿入してくれるプラグインです。指定したドメインのみnofollowを付けない、というようなこともできます。

※nofollowとは、外部リンクに対してSEO効果を付与しないことです。HTMLだとこうなります。

<a href="http://example.com" rel="nofollow">Example.com</a>

インストールから動作まで

手順①

WP Nofollow Postをインストールします。検索してインストールしてもWordPress.orgからダウンロードしても構いません。

WP Nofollow Post – WordPress.org

WP Nofollow Post

 

手順②

有効化を行なった後、メニュバーにある[設定]のところからWP Nofollow Postの設定画面に移ります。

そこにあるメニューやテキストボックスについて説明します。

WP Nofollow Post - Controller

WP Nofollow Post status: WP Nofollow Postを有効にするか否かです。Enable(有効)にしておかないと動作しません。

Activate on: どの投稿でnofollowを有効にするです。Post & Pagesだと投稿と固定ページにのみnofollowが挿入されます。

テキストボックス: ここに書いたドメインにはrel=”nofollow”が挿入されません。

(例) mcpe-jp.comとココに書くと、memo.mcpe-jp.comもnofollowが挿入されなくなります。

 

設定が終わったら下にあるボタンから保存しましょう。


まとめ

このようなプラグインがなかなか見つからなくて困っていました。10分ほど海外サイトを回っていたところ、WordPress.orgへのリンクを見つけたので導入しました。

SEOを意識してブログを更新し続けるのであれば必須と言っても過言ではないでしょう。

 

以上、「WP Nofollow Post」の紹介でした。

Twitter SPAM!

【Twitter】自分のブログURLを定期ツイに入れてはいけない理由3つ

どうもこんにちは、よっしーです(      ^ω^)

 

そこのブロガーのあなた、自分のTwitterでブログのURLを定期ツイートに含めていませんか?

自分も過去はやってました。多くの人に見せられますしね(まぁ多くの人に流されますが)。

 

-ある日のこと

ある方「よっしーさんのブログにアクセスできません」

これを受けてTwitterを経由してこのブログにアクセスしてみました。

 

▂▅▇█▓▒ (’ω’) ▒▓█▇▅▂うわぁぁぁ!!

 

原因はSpamhaus*のDBLに「mcpe-jp.com」ドメインごと登録されてしまっていたからなのですが、その原因は大量の定期ツイートでした。

*Spamhausとは…インターネット上のスパムサイトのインデックスを作成している団体。Twitterはこれのインデックスを採用しているが、誤登録が多すぎて問題になっている

ではスパム判定された原因をリスト形式でまとめてみましょう

  • 定期ツイートにブログのURLを含めていた
  • 大量の定期ツイート
  • 短期間で多くの定期ツイートをしている

以上の3点です。中には定期ツイートにURLが入っていてもスパム判定されないサイトもありますよね?

 

例えばYouTube。多くのYouTube投稿者が定期ツイートに自分のチャンネルや人気動画のURLを含めて投稿していますが、これはYouTube自体の評価が高いためスパム判定されません。

 

これを理解した上で定期ツイートにブログのURLを含めたいのであれば

  • ある程度のアクセスや人気を獲得する
  • SEO対策をしてサイトの評価を上げる
  • ٩( ‘ω’ )و

等の条件を満たしてから実行するとよいでしょう。自分はこのせいで酷い目に遭いました…(´・ω・`)


実は今も

Spamhausにmcpe-jp.comドメインはスパムサイトとして登録されています。しかしTwitterではちゃんとアクセスすることができます。

これはTwitterのスパム解除申請フォームに解除申請を送信したからです。対応はとてつもなく遅く、自分は2週間後くらいに解除されました…。なんと申請は20回\(       ^ω^)/

 

とりあえず定期ツイートにURLを含めてはいけないというお話でした。Twitter SPAM!

Google Analytics Update - App Store

Google Analyticsがいろいろ変わった

どうもこんにちは、よっしーです✋

 

ついさっき、iPhoneのApp StoreにGoogle Analyticsアプリケーションのアップデート通知が来ました。

 

前のアイコンはこんな感じ。

Google Analytics Old App Icon

アップデートの欄を見てみると…ん…?

Google Analytics Update - App Store

アイコン変わってる!!!

 

ってことはUIも変わったのか…?ということでアプリを起動。

new Google Analytics screen

変わった…()

SUGEEEEEEEEE!!このUI最高ッッ!

 

ってことでこちらの非公式アプリは消そうかな…?


関連サイト

 

Google Analytics

Google.org

今回の地震まとめ:熊本大丈夫ですか!?

どうもこんにちは、よっしーです。

先ほどの記事の執筆中に九州で大きな地震があったようです。

 

みなさまの一刻も早い復旧をお祈り致します。

 

 

なお、以下のツイートが「地震を政治利用している」として大炎上しています。

原発と地震が全く関係が無いとは言えませんが、ただ支持を得るためだけに「原発」という話題をわざわざ持ち込んで来ることの理由が理解できません。

——–以下関連リンク——–

http://gigazine.net/news/20160414-earthquake-kumamoto/

https://t.co/fqbqR0WI4I

プログラム関係の質問をするときは知恵袋かLINE Q、どちらが良いのか検証してみた

どうもこんにちは、最近深夜に寝ることが多くなってしまったよっしーです( ˘ω˘)スヤァ

 

今回はプログラム関係の質問をするときには「Yahoo!知恵袋」か「LINE Q」どちらが良いのかを検証してみました。

検証した内容は以下の通りです。

  • 回答の質
  • 回答してくれる早さ
  • 関係するカテゴリの質問の数

この3つを判断基準としました。ではまずLINE Qから。

LINE Q

image

LINE Qで質問するメリット:

  • 質問することでコイン(ポイント)がもらえる
  • 自分の回答可能なカテゴリを指定できるため、同カテゴリに属している人から回答をもらえる可能性が高くなる

以上の二点です。検証内容の評価では、

  1. 回答の質: 悪い
  2. 回答速度: ものによるが、大抵遅い
  3. 関連質問: プログラム言語にもよるが、PHPは比較的多め。

です。回答の質が悪いのは、ただ単にそれに関連する他サイトのエントリーのURLだけを送ってくるということです。

もう既に検索して見たページや記事が多く、回答にもなっていない場合も多々あったり。

 

利用するデメリット:

  • コインを掛けても回答が遅い。
  • なかなかベストな回答が来ない(ものによる)。
  • PerlやPythonなどのプログラム言語のカテゴリがなんと無い!
  • 多少クローズドな傾向あり。

 

Yahoo!知恵袋

image

Yahoo!知恵袋で質問するメリット:

  • コインを掛けなくても非常に早く回答が来る。
  • ひとつひとつ丁寧に回答してくれる回答者さんが多め。
  • わざわざサンプルコードも併せて送ってくれる方もいる。
  • Yahoo! JAPANが運営しているため信頼がある。

です。以上の三点の理由で自分はYahoo!知恵袋の利用をおすすめします。検証内容の評価では、

  1. 回答の質: 良い
  2. 回答速度: ものによるが、大半は非常に早い。
  3. 回答質問: 多い!多すぎるッ…!!

です。

利用するデメリット:

  • 質問してもコインがもらえることは無い。
  • 画像をアップロードして表示したとき、非常に粗くなる。
  • サーバーのレスポンスがLINE Qより遅いが、気にはならない。

以上の理由から、自分はYahoo!知恵袋の利用を推奨します。

 


まとめ

教えて!gooやOKWaveなどもありましたが、最近の利用者が多い2つのサービスから比較させていただきました。

元々は自分もLINE Qユーザーでしたが、Yahoo!知恵袋に登録したのをキッカケに質問サービスをLINE Qから知恵袋に変えました。

とても良い質の回答、そしてその早さに魅了されました。

みなさんも知恵袋を利用してみませんか?

→http://chiebukuro.yahoo.co.jp

【Bootstrap】バージョン4が来てた

なんとたまたまBoostrapのサイトにアクセスしたところ。

image

Bootstrap4が来てた!!!

はいそこ気づくのオセェよとか言わない!( ‘ᾥ’ )

ダウンロードしよう。

Bootstrap 4告知ページにあるGitHubへのリンクよりダウンロードしましょう。

 

変更点(告知ページより引用)

Moved from Less to Sass. Bootstrap now compiles faster than ever thanks to Libsass, and we join an increasingly large community of Sass developers.
Improved grid system. We’ve added a new grid tier to better target mobile devices and completely overhauled our semantic mixins.
Opt-in flexbox support is here. The future is now—switch a boolean variable and recompile your CSS to take advantage of a flexbox-based grid system and components.
Dropped wells, thumbnails, and panels for cards. Cards are a brand new component to Bootstrap, but they’ll feel super familiar as they do nearly everything wells, thumbnails, and panels did, only better.
Consolidated all our HTML resets into a new module, Reboot. Reboot steps in where Normalize.css stops, giving you more opinionated resets like box-sizing: border-box, margin tweaks, and more all in a single Sass file.
Brand new customization options. Instead of relegating style embellishments like gradients, transitions, shadows, and more to a separate stylesheet like v3, we’ve moved all those options into Sass variables. Want default transitions on everything or to disable rounded corners? Simply update a variable and recompile.
Dropped IE8 support and moved to rem and em units. Dropping support for IE8 means we can take advantage of the best parts of CSS without being held back with CSS hacks or fallbacks. Pixels have been swapped for rems and ems where appropriate to make responsive typography and component sizing even easier. If you need IE8 support, keep using Bootstrap 3.
Rewrote all our JavaScript plugins. Every plugin has been rewritten in ES6 to take advantage of the newest JavaScript enhancements. They also now come with UMD support, generic teardown methods, option type checking, and tons more.
Improved auto-placement of tooltips and popovers thanks to the help of a library called Tether.
Improved documentation. We rewrote it all in Markdown and added a few handy plugins to streamline examples and code snippets to make working with our docs way easier. Improved search is also on it’s way.
And tons more! Custom form controls, margin and padding classes, new utility classes, and more have also been included.

 

Google翻訳にかけてみる。長文めんどくさいから…

少ないからSassに移動しました。ブートストラップは、今Libsassにこれまで以上に速い感謝をコンパイルし、私たちはサスの開発者のますます大規模なコミュニティに参加します。
改善されたグリッドシステム。私たちはより良いターゲットモバイルデバイスに新しいグリッド階層を追加し、完全に私たちのセマンティックミックスインをオーバーホールしました。
オプトインフレキシボックスのサポートはここにあります。今後は、ブール変数を今-スイッチとフレキシボックスベースのグリッドシステムとコンポーネントを利用するためにCSSを再コンパイルされています。
カード用井戸、サムネイル、およびパネルを落としました。カードはブートストラップするために、ブランドの新しいコンポーネントですが、彼らはほぼすべての井戸、サムネイルがそうであるように、彼らは超おなじみの感じられるでしょう、そしてパネルは、唯一のより良いでした。
新しいモジュール、リブートに連結当社のすべてのHTMLがリセットされます。単一サスファイルのborder-ボックス、余白の調整、およびより多くのすべて:あなたはボックスのサイズ変更のようなより多くの独断リセットを与え、Normalize.cssが停止した場所での手順を再起動します。
ブランドの新しいカスタマイズオプション。代わりにグラデーション、トランジション、影、およびv3のような独立したスタイルシートへのより多くのようなスタイルの装飾を格下げ、我々はサス変数にすべてのこれらのオプションを移動しました。すべてのデフォルトの遷移をしたいか、丸みを帯びた角を無効にするには?単に変数を更新し、再コンパイルします。
IE8のサポートを落とし、レムと全角単位に移動しました。 IE8のサポートをドロップすると、我々はCSSハックまたはフォールバックで戻って開催されることなく、CSSの最良の部分を活用できる​​ことを意味します。ピクセルは、REMSおよびEMS適切な応答タイポグラフィと部品のサイズをさらに容易にするためにスワップされています。あなたはIE8のサポートが必要な場合は、ブートストラップ3を使用し続けます。
すべての私達のJavaScriptのプラグインを書き直し。すべてのプラグインは、最新のJavaScriptの拡張機能を利用するにはES6に書き直されました。彼らはまた、今UMDのサポート、一般的な分解方法、オプションの型チェック、およびトン以上が付属しています。
ツールチップとpopoversの改善された自動配置テザーと呼ばれるライブラリの助けに感謝します。
改善されたドキュメント。私たちはMarkdown記法でそれをすべて書き直し、道が容易私たちのドキュメントで作業を行うために例やコードスニペットを合理化するためにいくつかの便利なプラグインを追加しました。改良された検索は、それの途中でもあります。
そして、トン以上!カスタムフォームコントロール、マージンとパディングのクラス、新しいユーティリティクラス、およびよりも含まれています。

 

やべぇ理解できねぇ(汗)

まぁとりあえず、最新版です。

今はDev版なので未完成ではありますが、メインシステムのあたりは通常通り使用できます。

 

Let’s Bootstrap!

【無料レンタルサーバー】Adexdが凄かった。

どうもこんにちは、最近記事を投稿できていなかったよっしーです(´・ω・`)

 

その理由は今回紹介する「Adexd.net」レンタルサーバーにサーバーを移管したからです。

このAdexd.netではPHP、Perl、Python、Rubyが利用できます。

非常に魅力的なのは、SSHが利用可能なことです。

https://www.adexd.net

なんと最新バージョン「PHP7」を利用可能です。

image

モジュール版PHPを選択可能なので、WordPressが非常に高速で動作します。

ちなみにこのブログはAdexd.netのPHP5 モジュール版PHPで稼働しています…(=゚ω゚)ノ

 

「Adexd.net」まとめ

  • Python利用可能
  • Ruby利用可能
  • Perl利用可能
  • PHP利用可能
  • SSHでの接続可能
  • 容量は3GB
  • MySQL(MariaDB)・SQLite完備
  • phpMyAdminが設置されている
  • 独自ドメイン利用可能
  • CGIインストール(WordPress,Freo)
  • 広告一切無し
  • Intel Xeon  CPU E31230 @ 3.20GHz
  • Memory 8GB
  • PHP5・7、FastCGI・mod_phpなど
  • サポートチケットシステムあり。障害報告はTwitterでも受けてくれる。Twitter @adexd_net

 

追記:

ここはファイル置き場ではありません。

また、迷惑メールを送信するためのサービスでもありません。

個人が特別に無償で提供してくださっているサーバーです。使い方を考えて登録しましょう。

php+image

【PHP】画像の縦横のサイズ取得方法

どうもこんにちは、よっしーです(    ^ω^)ノ

 

ちょっと今回Web開発時に使う画像のピクセル数を知りたくて…でもiPhoneなんです(´;ω;`)

iOS用に専用の画像についての情報を表示してくれるアプリはあったのですが、残り容量が610MBだったのでインストールは避けました()

そこでPHPでこの機能を実現させました。サンプルコード等も載せているのでご自由にコピペしてお使いください。

PHP

 

サンプルコード

Sample.php

今回はPHPで画像の縦横をピクセル単位で取得 / また、その他の画像ファイルについての情報を取得する方法を説明します。

テスト用の画像ファイルの名前をexample.jpgとします。まずは画像の縦横の大きさをピクセル単位で表示させるコードです。

<?php

list($imgW,$imgH) = getimagesize('example.jpg');

print $imgW. "<br/>";
 print $imgH;

 ?>

このコードは$imgWに画像の横を、$imgHに画像の縦の長さを代入してあります。


ただ単に画像の縦横の大きさを取得したい方はここでブラウザバックして構いません。

ここからは画像ファイルのサイズを取得・また、その画像の表示をさせてみましょう。先ほどのコードを流用します。

<?php

list($imgW,$imgH) = getimagesize('example.jpg');

print $imgW. "<br/>";
 print $imgH;

$filesize = filesize($image);
 $s = array('B', 'KB', 'MB', 'GB', 'TB', 'PB');
 $e = floor(log($filesize)/log(1024));
 echo $filename . '' . sprintf('%.1f '.$s[$e], ($filesize/pow(1024, floor($e))));
 
 ?>
[こちらよりコードを引用させていただきました]

これで主なデータは取得できました。

あとは自分であれこれしてツールとして利用するのも手です。

頑張ってください〜(・ω・)/~~

iPhoneでクソコラ画像を作ろう!『Phonto』

どうもこんにちは、よっしーです( ・ω・)ノ  

 

最近Twitterなんかで「クソコラ」と呼ばれるものを見かけたことはありませんか?

世の中のトレンドになっているものほど多くのコラ画像が作成されやすく、広範囲に拡散することができます。

では実際にiPhoneでコラ画像を作ってみよう!というところから詳しく説明します(OωO)

(さらに…)

『Font Awesome』で文字アイコンをHTMLに取り入れよう!

どうもこんにちは、よっしーです(=゚ω゚)ノ   今回はHTMLコードのみで画像アイコンみたいなものを導入する方法を書きました。

「画像みたいなアイコン」ってなんぞや

(;´・ω・)ウーン、説明が難しいです。 実際に載せてみましょう!

  こちらのTwitterアイコンは画像ではなく、文字に色を付けたものです!

画像より軽いので良いですね〜(^ω^)〜

では、この文字をHTMLで表示する手順を説明いたします。もちろん、WordPressでもできます。

手順①

headタグ内に以下の記述をする

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

これでCSSが読み込まれます。自分のウェブサーバーにCSSを設置してもOKです。

 

手順②

Font Awesome(http://fortawesome.github.io/Font-Awesome/icons )から載せたいアイコンを選択します。

今回はMicrosoft Windowsのロゴにしてみます。

検索フォームから「Windows」を検索・クリックします。

 

手順③

FontAwesome - Microsoft Windows

ページに記載されている<i>タグをコピーします。

 

手順④

アイコンを載せたいページの場所にコピーしたコードをペースト(Ctrl+V)します。これで完了です!

色付けはfontタグやstyle、CSSで行なってください。


いかがでしたでしょうか。

この作業をWordPressで行なうときはテーマに同梱されているheader.phpに先述したタグを挿入しておいてください。

また、今後も多くのアイコンがFont Awesomeに追加されていく予定です。

公式サイトのフォームにメールアドレスを入力するとアイコンの更新通知が受け取れます。この機会に登録してみてはいかがでしたでしょうか?


 

関連サイト

 

Font Awesome Icons

Get Started – Font Awesome