【React】Game Usersを一緒に作ろう!【Node.js】 [無断転載禁止]©2ch.net

1あづみ ◆WYiR3RzL3U 2017/03/23(木) 21:09:13.31ID:???
ゲームユーザーズはゲームユーザーのためのコミュニティサイトです。
現在、開発者を募集しています。
初心者でもWebを触ったことのないプログラマーでもOKです!

ReactやNode.jsを使える、または興味があるみなさん
ぜひ一緒にやりましょう!
デザインできる人も協力してくれると嬉しいです。

開発者募集!
https://gameusers.org/dev/blog/developer/

開発ブログ
https://gameusers.org/dev/blog/

GitHub
https://github.com/gameusers/web

Game Users
https://gameusers.org/

質問・疑問なんでも書き込んでください。
ブログの記事をここにも投稿するので読んでみてね。

58あづみ ◆WYiR3RzL3U 2017/10/28(土) 16:16:22.12ID:???
ついにβ版が完成しました。ここまで来るのに長かった…。何度も何度も書き直してやっと。

シェアボタン公式トップページ
https://gameusers.org/dev/blog/wp-content/uploads/2017/10/share-buttons-top-20171028.jpg

最近もクロスドメインの問題でAPI絡みの部分を書き直していたのです。
今まではサイト内で使う自家用APIしか作っておらず
同じノリで公開部分のAPIを作っていたため、違うドメインからAPIにアクセスできなくなっていました。

他にもネットワーク上にアップロードするとなぜか動かなくなる部分が出てきたりで
もっと早く公開するつもりだったのですが、伸びに伸びて11月直前になってしまいました。

以下のURLでチェックできるので、よかったらアクセスしてみてください。

https://gameusers.org/app/share-buttons

シェアボタンを作成して使ってもらってもかまわないのですが
まだローカル環境と gameusers.org 上でしかテストが済んでいないので
その他の環境の場合、なんらかの問題が起こるかもしれません。
あとテーマが一種類しかなく、課金システムもテスト版になっています。
誰もする人はいないと思いますが、まだ課金は行わないようにしてください
(クレジットカードの入力ウィンドウの右上にTEST MODEと書かれている場合はテスト版です)

59あづみ ◆WYiR3RzL3U 2017/10/28(土) 16:16:39.47ID:+g9+lxtU
後はファイルをZipでまとめてプラグイン形式にして
このブログともう一つテスト用のブログを作成して、プラグインの動作テスト
それが終わったら公式プラグインに申請します。
公式プラグインとして認められたら完成に大きく近づくので、気合を入れて頑張ります。

ちなみにWordPressで使用する場合
公式サイトでシェアボタンを作成してダウンロードして使うよりも、プラグインで使用した方が便利です。
プラグイン版は作成したシェアボタンがWordPressの置いてあるサーバー上に保存され
いちいちダウンロードしなくても使用することができます。
興味のある方はプラグイン版が完成するまで待っていてください。

60あづみ ◆WYiR3RzL3U 2017/11/02(木) 22:53:30.65ID:???
ブログにプラグイン版をインストールしてシェアボタンを表示してみました。
我ながらなかなかいい感じです。

ブログトップ
https://gameusers.org/dev/blog/wp-content/uploads/2017/11/blog-top-20171102-1.jpg

完成が近いと思っていたのですが、機能をチェックしていると様々な問題が発覚しました。
IEとMicrosoft Edgeでシェアボタンが正常に表示されないという致命的な問題が見つかり
今日はそれを修正していました。
とりあえずシェアボタン自体は表示されるようになったのですが
シェアボタンを作成するページがIEではどうやっても動かず…。

IEのシェアは年々下がっており、20パーセント程度になっているようなので
もうほっておくことにしました。シェアボタン自体は動くので作る時は
新しいブラウザでやってくださいということにします。

その他、認識している問題は2つあります。

・モバイル機器で見るとテーマのボタン画像がぼやける
・モバイル機器で見るとシェア数の文字が1ピクセルずれる

Retinaディスプレイで画像を表示するときは、予め大きめの画像を用意して縮小して
表示しなければならないという情報は知っていたのですが
そんな気になるほどボケないだろうと、いい加減な姿勢でテーマ画像を作ったところ
モバイル機器でチェックすると文字が読めないくらいぼやけていました。

61あづみ ◆WYiR3RzL3U 2017/11/02(木) 22:55:30.53ID:CS7GAm0c
Androidのタブレットとスマホしか持っていないのですが
Androidでもぼやけるんですね。Android機器でも
Retinaディスプレイと同じ表示方法が取られているんでしょうか?

まぁこの問題自体は画像を大きく作れば済むので解決できるのですが
問題は2つ目の「モバイル機器で見るとシェア数の文字が1ピクセルずれる」なんです。
なぜかモバイル機器でシェアボタンをチェックすると
1ピクセルだけシェア数の文字が上に表示されます。

https://gameusers.org/dev/blog/wp-content/uploads/2017/11/pc-mobile-1pixel-20171102-2.png

わかりにくい画像で申し訳ないのですが、こんな感じにずれているのです。
同じChromeなのにPCとタブレットでなぜ表示位置が変わるんでしょうか。
原因がさっぱりわからないので、どなたかわかる方がおられましたら教えてください。

モバイルからのアクセスだけ1ピクセル下に表示するという
強引な解決方法もあるのですが、あんまりスマートな解決方法じゃないので気が進まないんですよね。

62あづみ ◆WYiR3RzL3U 2017/11/05(日) 00:09:14.03ID:???
リポジトリ公開 & IEで動きました!

GitHub リポジトリトップ画像
https://gameusers.org/dev/blog/wp-content/uploads/2017/11/banner.jpg

Game Users Share Buttons リポジトリ
https://github.com/gameusers/share-buttons

GitHubのリポジトリを作成し、シェアボタンのコードを公開しました。
いずれ他のソーシャルサイトのシェア方法・シェア数の取得方法を
知っているプログラマーの方が現れて、爽やかにコードを提供してくれたらいいのになと夢見ております。

このシェアボタンの使用者が増えて知名度が上がれば
そういう方も出てくるかもしれないので、頑張ってテーマや機能を充実させていこうと思います。


前の記事で言っていた IE でシェアボタンの作成ページが動かない問題ですが
なんと Promise の Polyfill を用意するだけで動きました。
最初は babel-polyfill で旧ブラウザ環境に対応しようと思ったのですが
スクリプトのサイズが無駄に大きくなってしまうので、babel-polyfill の使用は諦めたのです。

シェアボタンはシェアボタンを作成するページのスクリプトと
シェアボタンを表示するスクリプトに分かれているのですが
babel-polyfill を充てるとシェアボタンを表示するためのスクリプトが非常に重くなってしまいました。
圧縮前は60KB(圧縮後は30KB)程度なのですが、それが330KBに。さすがにこの膨れ上がり方はやばい。

63あづみ ◆WYiR3RzL3U 2017/11/05(日) 00:10:09.35ID:nAaiXEl0
というわけで必要なものだけ Polyfill を充てるという方針になったのですが
その場合は IE での動作は諦めるしかないと思っていたのです。
Fetch や Async など、いろいろ IE と相性の悪そうな新機能を使っていましたし。
しかし、それらについてはすでに Polyfill が充てられていたので、
後は Promise だけという状況になっていたようです。

業務で IE への対応に四苦八苦している方がいる中、自分は本当に運が良かったと思います。
制作中、一度も IE での動作環境をしなかったのに、この結果はラッキーとしか言いようがない。


本日、WordPress の公式ディレクトリへ登録してもらうため、プラグイン申請を行いました。
承認してもらえると WordPress のプラグインページから検索してインストールすることができるようになります。

…が、もし拒否られたら…と思うと心配でなりません。
長い時間をかけてプラグインを作成してGitHubまで用意したのに
なにか根本的な問題が見つかって掲載不可になったら…。

大丈夫だろうか?

64あづみ ◆WYiR3RzL3U 2017/11/10(金) 17:32:19.31ID:???
まさか、無料でSSLが利用できるなんて!

ある日突然、Chrome の console に以下のような表示が出ていました。

The certificate used to load https://gameusers.org/app/pay uses an SSL certificate
that will be distrusted in Chrome 66. Once distrusted,
users will be prevented from loading this resource.
See https://g.co/chrome/symantecpkicerts for more information.

Google 翻訳
https://gameusers.org/app/payをロードするために使用された証明書は
Chrome 66で信頼されないSSL証明書を使用します。
一度信頼されないと、ユーザーはこのリソースを読み込むことができなくなります。
詳細については、https://g.co/chrome/symantecpkicertsを参照してください。

調べてみたところ、過去に発行されたシマンテックの証明書に問題があるらしいです。
Game Users で使っている Rapid SSL もダメとのこと。

http://security.data-site.info/801.html

2018年3月15日までに証明書を新しいものに書き換えないといけないみたいです。
Rapid SSL は他の高価な証明書に比べると格安で良かったのですが
どうせ更新するならと、他にも新しい発行業者が出ていないか調べてみました。
すると「Let’s Encrypt 」という無料で利用できるとうたっているサービスを発見。
さすがに無料は怪しいだろと思ったのですが、サイトを見てみるとこのように書かれています。

65あづみ ◆WYiR3RzL3U 2017/11/10(金) 17:34:35.00ID:???
非営利団体の ISRG (Internet Security Research Group) が運営しており
シスコ(Cisco Systems)、Akamai、電子フロンティア財団(Electronic Frontier Foundation)
モジラ財団(Mozilla Foundation)などの大手企業・団体が
ISRG のスポンサーとして Let’s Encrypt を支援しています。

どこかで聞いたことのある名前ばかり。疑念が払拭されたので
これを利用してみよう、仮にまともに使えなかったとしても無料だし
試してみる分には問題ないだろうということで、VPS (Cent OS6) で利用してみました。

使い方はここにすべて書いてあります。

https://letsencrypt.jp/usage/
https://letsencrypt.jp/usage/install-certbot.html


EPEL リポジトリを有効にする

yum install epel-release


certbot-auto を拾ってきて実行

wget https://dl.eff.org/certbot-auto
chmod a+x certbot-auto
./certbot-auto


以下、certbot 実行時の黒い画面の文字、Google の翻訳も英文の下に載せておきます。
(長いので気になる方はブログでチェックしてください)
https://gameusers.org/dev/blog/notes/20171110-1

66あづみ ◆WYiR3RzL3U 2017/11/10(金) 17:36:44.63ID:2YxqB0kV
この間、わずか10分ほどです。なんとこれだけで SSL の設定が完了しました。
英語ですが数問の対話に答えるだけでウェブサイトへの SSL 導入が完了します。
あとは httpd を再起動するだけで反映されます。

service httpd start

数年前、初めて SSL を導入したときは中間証明書だなんだと難しい処理をした覚えがありますが
今回はたったこれだけで終了。しかも無料!
証明書の期限が三ヶ月しかないという問題はありますが
これは cron で更新すればいいだけなので
実質なにもしなくても無料で SSL がずっと利用できることになります。

証明書
https://gameusers.org/dev/blog/wp-content/uploads/2017/11/ssl.png

ちなみに証明書を更新する方法は以下のような感じです。
毎日、朝の6時45分に証明書の更新を実行する。更新できた場合は httpd も再起動する。
毎日、実行していても、期限の30日前にならないと証明書の更新処理は実行されないので
向こうのサーバーに負荷をかけることもないとのことです。

45 6 * * * /root/certbot-auto renew --post-hook "service httpd restart"

正直、cron を触ることはあまりないので、こっちの設定の方が時間がかかりました。
この書き方が正しいのか更新されるまでわからないので、cron の部分についてはあまり参考にしないでください。

それにしても Let’s Encrypt すごすぎる!

67Name_Not_Found2017/11/10(金) 21:42:27.16ID:Vfg4Wfkx
あんあー

68Name_Not_Found2017/11/11(土) 13:10:01.59ID:???
「Let’s Encrypt 」は、3か月毎に更新しないといけない

69あづみ ◆WYiR3RzL3U 2017/11/12(日) 13:45:58.26ID:???
でも無料なのはすごいですよね

70Name_Not_Found2017/11/12(日) 13:58:23.19ID:???
あんあー

71あづみ ◆WYiR3RzL3U 2017/11/15(水) 18:55:54.80ID:???
WordPress のプラグイン版が完成しました

WordPress 公式プラグインページ
https://gameusers.org/dev/blog/wp-content/uploads/2017/11/wordpress-plugin-page.jpg

https://wordpress.org/plugins/game-users-share-buttons/

ようやく完成しました!ちょっと前からプラグイン版は公開されていたのですが
プラグインをアップデートするとテーマが消えるというやっかいな問題が発生し
その対応が終わるまで記事にしないでおきました。

何度も修正を重ねたので、バージョンはすでに1.0.9になっています。
WordPress独特の仕様と、プラグインをアップデートした際に
ファイルがどう扱われるのかについての情報がネットに全然なかったので
その点で苦労しました。

どうもアップデートするとプラグインのディレクトリを
内部のファイルごと入れ替えるようなのです。
そのせいで内部に作成したテーマファイルも一緒に消えてしまうという
ややこしい仕様です。一時的に削除されない場所にディレクトリを作成し
アップデート後にそこからテーマファイルをコピーするという処理で解決したのですが
これはマナー的にどうなのかという思いもあります。

後日、そのことについて詳しく情報を残すつもりなので
詳しい方が見てくれて情報を提供してくれることに期待!

72あづみ ◆WYiR3RzL3U 2017/11/15(水) 18:57:05.59ID:vK7ATm9A
いろいろ苦戦したのでまだテーマがひとつしかないのですが
WordPressでブログをやっている方はぜひ使ってみてください!
サクサク動いてなかなかいい感じだと思います。
素材サイトからアイコンをダウンロードすると
オリジナルのシェアボタンを作成することも可能です。

WordPressのダッシュボード > プラグイン > 新規追加ページで
「Game Users Share Buttons」を検索してください。
黒猫のアイコンのプラグインです。

Game Users Share Buttons アイコン
https://gameusers.org/dev/blog/wp-content/uploads/2017/11/icon-256x256.png

頑張って作ったのでみんなに使ってもらいたい!

73あづみ ◆WYiR3RzL3U 2017/11/23(木) 14:59:48.84ID:???
現在のテーマ

https://gameusers.org/dev/blog/wp-content/uploads/2017/11/themes-20171123.jpg

テーマを3つ追加しました。ぶっちゃけデザイン的なセンスがないため、
産みの苦しみがすごいです。絵が描けたり、グラフィックデザインができるなら
もうちょっとサクサクと完成させられると思うのですが
自分にはそのどちらの能力もないため、どうしても時間がかかってしまいます。

このシェアボタンはリンクを貼れるので
この機能をアピールしてデザインが行える人にテーマを作ってもらえないだろうかと考えているのですが
はたしてうまくいくでしょうか。

シェアボタンを見てもらえるとわかるのですが
黒猫の画像に公式サイトへのリンクが貼られています。
これを画像ごと他のサイトのリンクに変更できるのです。
画像にロゴを利用して、自サイトへのリンクを貼ると
そのテーマを利用してくれた方のブログからリンクが貼られることになります。
この宣伝効果はすごいと思うのですが、デザイナーの方々に魅力的に感じてもらえるでしょうか。

もし絵が描ける方やデザインができる方で
この記事を見てくれた方はぜひとも前向きにご検討をよろしくお願いします。
時間をかけて作成するだけのメリットはあると思うのでぜひ!

74あづみ ◆WYiR3RzL3U 2017/11/23(木) 15:02:58.59ID:???
最近追加した機能

https://gameusers.org/dev/blog/wp-content/uploads/2017/11/free2.png

高さのないシェアボタンを作成したときに
デザイン的にネコの画像も同じくらいの高さにしなければならないのですが
全身の場合、縮小しすぎるとなんの画像なのか認識しづらくなるため
ネコの顔だけの画像を選べるようにしました。全身よりもこっちの方が使いやすそうです。

75あづみ ◆WYiR3RzL3U 2017/11/23(木) 15:03:55.84ID:0egG1hXi
モバイル環境での文字ズレ

https://gameusers.org/dev/blog/wp-content/uploads/2017/11/pc-mobile-1pixel-20171102-2.png

以前、モバイル環境でシェアボタンを表示すると文字がずれると記事にしたのですが
あれから時間を設けていろいろ調べてみました。
div 1つか2つくらいのシンプルな構成で
スタイルシートも極力シンプルにした状態で文字位置を比較してみたのですが
それでもPCとモバイル環境で同じ表示にはなりませんでした。

どうも使用しているフォントとサイズによってはズレが生じるようなのです。
Google Fonts を利用し、フォントサイズを変えながら表示してみたところ
ズレがないサイズとズレのあるサイズが出てきたのです。
このため、モバイル環境からのアクセスは
一律表示位置を1ピクセル下げて表示するという方法は使えなくなりました。

そこで iOS と Android でのアクセス時にズレを調整するフォームを用意して
そこで各自設定を行ってくださいという方針にしました。
どちらのハードも所有していて確認が行える人はなかなかいないと思いますが
一応、機能だけは提供しておくことでこの問題の解決を図ります。



機能的にはそれなりのものを提供できていると思うので
後は宣伝を頑張らないといけません。
使ってもらえば、それなりに良さはわかってもらえると思うのですが
なにか良い宣伝方法はないでしょうか?

76あづみ ◆WYiR3RzL3U 2017/11/29(水) 14:39:10.50ID:???
シェアボタンの公式サイトに新しいページを追加

テーマ募集
https://gameusers.org/app/share-buttons/recruitment

キャンペーン
https://gameusers.org/app/share-buttons/campaign

各ページにメールフォームを設置して、簡単に連絡が取れるようにしました。
テーマを募集しているのですが、作ってもらったシェアボタンを
メールに添付して送ってくださいというのは
テーマを提供してくれる方に負担が大きいのではないかと思うので
専用フォームで必要事項を入力してファイルを送信できるようにしました。

77あづみ ◆WYiR3RzL3U 2017/11/29(水) 14:39:42.14ID:???
あと Game Users Share Buttons の知名度を上げるために
ブログにシェアボタンの紹介記事を書いてくれたら
ビジネスプランの利用券をプレゼントするキャンペーンも開始。

78あづみ ◆WYiR3RzL3U 2017/11/29(水) 14:40:17.06ID:pd1LS+oz
環境は整ったので、後はユーザー獲得を頑張らなければ!
と思っていたところに、ちょうどいい記事を発見。

ポール・グレアムによる「スケールしないことをしよう」
http://postd.cc/do-things-that-dont-scale/


創業者が外回りをしてユーザーを獲得するのを嫌がる理由は、2つあります。
1つは、内気さと怠慢さの両面です。彼らは外に出向いて
恐らく断るであろう大勢の知らない人たちと話をするよりも
家にこもってコードを書くことを好みます。
しかし、スタートアップを成功させるには
最低でも一人の創業者(大抵はCEO)は営業やマーケティングに
たくさんの時間を費やす必要があるのです。


これは本当にそうです。自分もコードを書いてる方が楽なので
宣伝活動にいまいち積極的になれないでいたのですが
それではダメなんですよね。
結局のところ、自分で地道に営業活動を頑張るしかない。
せっかく大きな労力を費やしてシェアボタンを完成させたのに
使ってくれる人を増やす努力をしないのはもったいない。

79Name_Not_Found2017/11/29(水) 21:00:03.00ID:???
Google でも基本は、1件1件、電話する。
旅行・ホテル・飲食店などをまとめたサイトも、1件1件、訪問する

客から見ると、どんな得があるのか? が重要で、
営業マンから、もうかるやり方を、教えてもらえるのが重要

しかも、文書を読まずに、会話で教えてもらえる事が重要。
文書を読んで下さいというのは、まず無理!

他人の作った文章を読むのは、無料でも全員が嫌がる。
有料でも講習会の方が良い。
話を聴けるから

五感すべてを使うので、理解力が高まるから、会話が好まれる。
これをコミュ力と言って、人間社会・集団に欠かせない資質。
つまり成功の条件

技術者を選択する人は、これが嫌いな人が多い。
だから、一般人からは相手にされない。
意思の疎通ができないから

80あづみ ◆WYiR3RzL3U 2017/11/29(水) 21:44:33.49ID:???
Googleでもそんな地道な営業をしてるんですね
自分も頑張らねば

今、メールでシェアボタンのプラグインを使ってくれそうな人に連絡を取ってみてるんですが
やっぱりメールも文書なので、効果は薄いってことでしょうか
講習会のようにダイレクトな感じでおすすめできる方法があればいいのですが
なかなか難しいですね

コミュ力は自分も発揮しなければならないと常々思っています
どうしても楽な方に逃げてしまうので
ネットで影響力のある人が気に入ってくれて
勝手に流行ってくれないかなとか、ありえない夢を見てしまいますね

確かに技術寄りの人は文系のウェーイという人たちと違って
内向きなイメージがあります
毎日、黙々と作業をしているのでどうしてもそうなってしまうのかもしれませんが


「客から見ると、どんな得があるのか? が重要で、
 営業マンから、もうかるやり方を、教えてもらえるのが重要」

すごく重要な教えな気がするので
今後はこの点をよく考えながらアピールしていこうと思います
営業活動には疎いので、こういう参考になる情報は本当にありがたいです

81あづみ ◆WYiR3RzL3U 2017/12/04(月) 12:18:00.23ID:LgXj0n50
サーバーをNode.jsにしたい気持ちが高まる

現在、サーバー側はPHPで動いているのですが、いずれNode.jsにして、
すべてをJavascriptで動く環境にしたいと思っています。
結構な時間をかけてPHPの処理を書いていると
そのうちJavascriptに書き換えることになるのに
どうしてこんなに力を入れてPHPを書いてるんだろうという気持ちになってしまいます。

その思いが重なり重なり、いよいよNode.jsの本でサーバー側の処理を勉強し始めました。
ちょっと読んだ感じでは、それほど難しい印象は持たなかったので
比較的簡単にNode.jsで動くページを作成できるかもしれません。
しかし現在動いているログインやプッシュ通知など
手間のかかるシステムをNode.jsに置き換えるのは楽じゃないと思うので
サーバー側を短時間に一新することは現実的にできそうにありません。

そこで一部のページから徐々に置き換えていくことを考えたのですが
そうした場合にApacheとNode.jsを同居させなければなりません。
この構成で運営されている方はすでにいるようなので
やり方については調べがついたのですが、問題はドメインやサブドメイン単位ではなく
ページ単位でサーバーを振り分けることができるのかということと
SSLが問題なく動くのかわからないという点です。

Node.jsにnode-http-proxyというパッケージがあって
それを利用すればサーバーを振り分けられることまではわかったのですが
ページ単位での振り分けについてはネットに書かれていませんでした。
さらにこの前、設定したLet's EncryptのSSLですが
これがNode.jsのサーバー上でも普通に動いてくれるのかわからないのです。

本当にもうわからないことだらけなんですが
そもそもの話、Web系って覚えること多すぎないですか?
範囲が広いのに、一人であらゆることに対応しなければならないので
そろそろ頭がパンクしそうです。

82あづみ ◆WYiR3RzL3U 2017/12/11(月) 13:29:56.42ID:w7PPoV7I
ブログをやっているなら絶対に設置しておきたいSNSのシェアボタン。
公式が提供するボタンから、WordPressのプラグインで表示できるものまで様々なものがありますが、
今回、ご紹介するのは、公式のものと比較すると表示速度は10倍!選べるテーマは無限大!
世界中の素材サイトからアイコンをダウンロードして
シェアボタンの画像として利用できる画期的なプラグインです。
絵を描いたりデザインが行える方なら
他にない世界でひとつのシェアボタンを作成することもできる、まさに夢のプラグインです!!

https://gameusers.org/dev/blog/wp-content/uploads/2017/11/banner.jpg


画像を見てください。これは世界中で提供されている
SNSのアイコンを利用させてもらって作ったオリジナルのシェアボタンです。
今回、紹介する「Game Users Share Buttons」を利用すると
誰でもこんなオシャレなシェアボタンをブログで使うことができるようになります。

これまではデザインに統一性のない公式のシェアボタンを並べて使うか
プラグインとして提供されている決まったデザインのシェアボタンを使うかで
見た目を変更する選択肢がほとんどなく、おしゃれなデザインのシェアボタンを設置しようとすれば
HTML・CSS・Javascript など Web 制作の知識が必要になったり
自分で画像を作る場合はデザインセンスが求められたり
誰でも簡単にできるというものではありませんでした。

しかし Game Users Share Buttons ならそれが可能です。誰にでも簡単にです!
この記事ではインストール方法、使い方について詳しく解説していきますので、ぜひ一度、使って試してみてください。

自分で紹介記事を書いてみました
長いのでブログの記事のURLを貼っておきます。

https://gameusers.org/dev/blog/wordpress/game-users-share-buttons

83Name_Not_Found2017/12/11(月) 14:48:20.57ID:???
あんあーwwwwwwwwwwwww

84Name_Not_Found2017/12/12(火) 02:54:52.52ID:MrUcGD8N
HPで友達が稼げるようになった情報とか

⇒ http://asaswq3wq.sblo.jp/article/181819223.html

興味がある人だけ見てください。

MY6HSHSQBP

85あづみ ◆WYiR3RzL3U 2017/12/15(金) 13:02:34.76ID:6cyF8qyp
しばらくブロガーになります!
とりあえずWordPress関連の記事を書いていこうと思います。


WordPressにはたくさんの便利なプラグインが用意されています。
こんな機能があったらいいのになと思うものは、だいたい存在していると言っても過言ではありません。

今回はプラグインのインストール方法について詳しく解説していきます。
WordPressを導入したばかりでよくわからない方は
この記事を参考にしてインストール方法を覚えてください。

プラグインのインストールには大きく分けて3つの方法があります。

https://gameusers.org/dev/blog/wordpress-plugin-install/

86あづみ ◆WYiR3RzL3U 2017/12/15(金) 13:03:18.77ID:???
WordPressに自作のCSS・JavaScript・HTMLを追加するには?

WordPress を利用していると、ここの見た目を変更したい
こんな機能を追加したいなどなど、さまざまな変更や機能追加をしたくなってきますが
そんなときに必要になるのが CSS(スタイルシート)や JavaScript です。

この記事では自作の CSS・JavaScript・HTLM をブログに追加する方法について解説していきます。

https://gameusers.org/dev/blog/simple-custom-css-and-js/

87あづみ ◆WYiR3RzL3U 2017/12/15(金) 22:24:57.15ID:???
WordPressのリスト(箇条書き)をCSSで綺麗に表示しよう!

WordPress で記事を書いていると箇条書きで表現したい項目が出てきます。
この時に利用できるのがリストです。投稿ページのビジュアルエディタで、
番号なしリスト・番号付きリストを選ぶと画像のようなリストを入力することができるようになります。

https://gameusers.org/dev/blog/wordpress-beautiful-list/

88あづみ ◆WYiR3RzL3U 2017/12/18(月) 12:42:18.56ID:???
WordPressのフォントを変更して印象をガラッと変えてみよう

WordPress の見た目を変えるときに、まず思いつくのはテーマの変更ですが、その次にはなにが思い浮かびますか?

特にこれといったものは思い浮かばないですよね。

そこでおすすめしたいのがフォントの変更です。
フォントを変えるとブログの印象もガラッと変わります。
WordPress のフォントについて詳しく書かれている記事はあまり見たことがないと思いますので
今回は WordPress のフォントについての情報を集めてみました。

https://gameusers.org/dev/blog/wordpress-font/

89あづみ ◆WYiR3RzL3U 2017/12/18(月) 19:49:09.83ID:2sqyokMZ
WordPress ? Webフォントの使い方

綺麗なフォント、おしゃれなフォント、面白いフォントを使いたい!
でも OS に備え付けられているフォントにはいいものがない。
そういった方におすすめしたいのが Webフォントです。
Webフォントは日々、世界中で新しいものがデザインされており、
有名なフォントサイトのものを軽く数えるだけでも、数百、数千に達します。

この記事では、外国製の英数字 Webフォントから日本製の日本語 Webフォントまで
WordPress での使い方を詳しく解説していきますので、ぜひ参考にしてください。

https://gameusers.org/dev/blog/wordpress-web-font/

90あづみ ◆WYiR3RzL3U 2018/01/04(木) 14:28:05.79ID:6uWzJ1fw
あけましておめでとうございます
今年もブログの記事を書いていこうと思います
WordPress関連の記事を書いて
その記事を読んでくれた方がシェアボタンを使ってくれたらいいなと考えております


WordPressのパーマリンクおすすめ設定

WordPress を設置したらまず最初にやっておきたい、パーマリンクの設定について説明していきます。
これだけやっておけば間違いない!というおすすめ設定を紹介しますので、ぜひ参考にしてください。

https://gameusers.org/dev/blog/wordpress-options-permalink/


WordPressの記事の一部を折りたたんで表示する方法 ? ネタバレ防止

WordPress の記事を書いていて、ここの説明長くなっちゃうから
折りたたんで必要な人だけに表示したいな、と思うことありませんか?

このブログは解説系のブログなので、慣れている人には必要ないけど
初心者の人に向けた情報などを掲載したいときに、記事の一部を折りたたんで表示しています。

https://gameusers.org/dev/blog/wordpress-slide-contents/

91Name_Not_Found2018/01/04(木) 23:57:04.30ID:K+4JM38X
errorって出るんだけど、Edgeだからかな。

92あづみ ◆WYiR3RzL3U 2018/01/05(金) 01:23:12.61ID:???
Game Usersにアクセスしたときに出るエラーのことなら
たまにデータの読み込みに失敗したり
なんらかのエラーが出た時にJavaScriptでerrorと出るようになってます。

このアラートは今となっては意味不明な仕様なんですが
たまにしか出ないから別にいいか、ということでそのままにしていました。
Edgeでもサイトの動作はチェックしてるんですが
たぶん毎回は出ないと思うのであんまり気にしないようにしてください。

Node.js と React で書き直す際にはちゃんと修正します!
今ブログ書くことに必死なので、いつになるかはわからないのですが。

93あづみ ◆WYiR3RzL3U 2018/01/05(金) 21:02:25.28ID:z4iU9ndX
WordPress ? 投稿日の代わりに更新日を表示する方法(日付操作)

なんてこった!昔の記事を編集して新しい情報を追加したのに、日付が古いまま。
せっかく中身を更新したのに読者に新しい情報だと認識してもらえない。
日付を見ただけでブログから人が離れていってしまうかも?

というわけで、投稿日の代わりに更新日を表示させましょう!

この記事では投稿日や更新日を表示したり非表示にしたりする方法を解説していきます。
スタイルシートを用いて、とても簡単に表示・非表示を切り替えることができますので
更新日を表示させたい方は、ぜひ参考にしてみてください。

https://gameusers.org/dev/blog/wordpress-datetime/

94あづみ ◆WYiR3RzL3U 2018/01/07(日) 00:19:31.92ID:PGwWgnyJ
WordPressのサイドバーを固定しよう ? スクロールに追従させる

アイキャッチ画像
https://gameusers.org/dev/blog/wp-content/uploads/2018/01/ec-wordpress-fixed-sidebar.jpg

文字数の多い記事を書くと、サイドバーよりも記事が大幅に長くなることってよくありますよね。
ブラウザでその記事を表示すると、サイドバーの部分になにもない空間が生まれてしまいます。

記事を読み終わった時に、サイドバーのメニューから他の記事も読んでもらいたいけど、
読者がサイドバーをチェックするには
わざわざスクロールを行ってページの上まで戻ってもらわなければなりません。

これはちょっと気が利いてないですよね。ページの回遊率も下がってしまいます。

だからサイドバーの位置を固定しましょう。スクロールに追従させれば
常にメニューが表示されるようになって、他の記事も読んでもらいやすくなります。

この記事ではプラグインを利用してサイドバーを固定する方法と
スタイルシートを利用して固定する方法の2つを解説しています。


完成品の動画
https://gameusers.org/dev/blog/wp-content/uploads/2018/01/wordpress-fixed-sidebar.mp4

記事
https://gameusers.org/dev/blog/wordpress-fixed-sidebar/

95あづみ ◆WYiR3RzL3U 2018/01/08(月) 21:35:26.84ID:WKYYAxfT
WordPress ページトップに戻るボタンをつけよう ? WPFront Scroll Top

アイキャッチ画像
https://gameusers.org/dev/blog/wp-content/uploads/2018/01/ec-wpfront-scroll-top.jpg

スクロールが非常に長くて、上まで戻るのが大変!
ブログトップはもちろん、文字数の多い記事や
カテゴリー、タグページなどでもそうなりがちですよね。
読者に優しいブログにするために、ワンクリックでページトップに戻るボタンをつけましょう。

この記事では、ページトップに戻るボタンをつけられるプラグインについて詳しく解説しています。

完成品の動画
https://gameusers.org/dev/blog/wp-content/uploads/2018/01/wpfront-scroll-top.mp4

記事
https://gameusers.org/dev/blog/wpfront-scroll-top/

96あづみ ◆WYiR3RzL3U 2018/01/17(水) 14:14:29.39ID:PC+PP5rs
WordPress ページID・記事ID・pidの取得方法

アイキャッチ画像
https://gameusers.org/dev/blog/wp-content/uploads/2018/01/ec-wordpress-pid.jpg

WordPress のプラグインを設定していると、pid という設定項目が出てくることがあります。
これは ページ ID という各記事ごとに割り振られている固有の ID を入力する項目です。
ページ ID は記事や固有ページを作成した際に自動で設定されます。

この記事ではページ ID の取得方法をスクリーンショット付きで解説していますので、
必要な方は参考にしてください。

記事
https://gameusers.org/dev/blog/wordpress-pid/

97あづみ ◆WYiR3RzL3U 2018/01/18(木) 14:58:30.76ID:UUOw2NCC
WordPress 記事にソースコードを埋め込むテクニック&プラグイン紹介

アイキャッチ画像
https://gameusers.org/dev/blog/wp-content/uploads/2018/01/ec-wordpress-e-source-code.jpg

解説系の記事を書いていると、HTML のタグや、JavaScript、スタイルシートなどの
ソースコードを埋め込んで紹介したくなるときがあります。

この記事ではそんな時に使える、簡単にコードを貼れるタグ
ウェブサービス、おすすめのプラグインを紹介していきます。

記事
https://gameusers.org/dev/blog/wordpress-embed-source-code/

98あづみ ◆WYiR3RzL3U 2018/01/18(木) 17:27:02.24ID:???
Game Users Share Buttons v1.2.1 更新情報

WordPress のプラグインで利用した際に、Top(記事の上) と
Bottom(記事の下)に指定したシェアボタンの詳細設定を行えるようにしました。


Top & Bottom 詳細設定

https://gameusers.org/dev/blog/wp-content/uploads/2018/01/gusb-v1.2.1-1.png

シェアボタンを表示するページを指定できます。
トップページ、個別投稿ページ、固定ページ、アーカイブページ
それぞれ表示したい場所をチェックして保存してください。

トップページやアーカイブページは通常、記事が一覧で表示されます。
そしてそれぞれの記事部分にシェアボタンが表示されるのですが
各記事のシェア数を個別に取得しているわけではないので
実質トップページならトップページのシェア数が表示されているだけです
(複数のシェアボタンに同じシェア数が表示されています)

そのため、一覧ページでは記事ごとにシェアボタンを
表示する意味はないのではないかと考え、トップページやアーカイブページなどでは
シェアボタンを表示しない設定を行えるようにしました。

またこれまでは余白設定で記事とシェアボタンの間隔を調整していましたが
画像の余白欄で、Top と Bottom のシェアボタンの間隔を個別に設定できるようにしました。
今後はこちらで余白を設定していただけるとありがたいです。

99あづみ ◆WYiR3RzL3U 2018/01/18(木) 17:29:11.74ID:???
簡単に貼り付けられる Code を表示

https://gameusers.org/dev/blog/wp-content/uploads/2018/01/gusb-v1.2.1-2.png

編集タブに表示されているシェアボタンを簡単に貼り付けられるコードを表示するようにしました。

Code ボタンを押すとテキストエリアが開いてコードが表示されます。
記事の上部・下部以外に貼り付けたい場合は
テキストエリアに表示されているコードを利用してください。


貼り付けるコードが変更されました

これは大きな変更なのですが、シェアボタンを貼り付けるためのコードを変更しました。

変更前

<div id="game-users-share-buttons" data-theme="gameusers1-olxdmwzh"></div>

変更後

<div data-game-users-share-buttons="gameusers1-olxdmwzh"></div>

HTML の仕様では、同じ id が複数存在しているのは間違いということを知り、修正を行いました。
今後は id ではなく、data 属性を利用して、Game Users Share Buttons の表示を行います。

コードを貼り付けて利用している方がおられましたら
お手数ですがシェアボタンを再ダウンロードし、貼り付けコードの変更を行ってください。

100あづみ ◆WYiR3RzL3U 2018/01/18(木) 17:30:00.81ID:UUOw2NCC
Feedly のシェアが行えなくなっていた問題を修正

Feedly の仕様が変更されたようで、シェアが正常に行えなくなっていましたが
v.1.2.1 で修正を行いました。


記事
https://gameusers.org/dev/blog/game-users-share-buttons-v1-2-1/

101あづみ ◆WYiR3RzL3U 2018/01/19(金) 21:25:09.27ID:og0B/uTs
WordPressのアイキャッチ画像とは?おすすめのサイズも紹介

アイキャッチ画像
https://gameusers.org/dev/blog/wp-content/uploads/2018/01/ec-wordpress-eye-catching.png

アイキャッチ画像とは各記事の看板画像のことです。
WordPress では、個別の記事ページだけでなく、記事が一覧で表示されるときにも利用されています。

記事
https://gameusers.org/dev/blog/wordpress-eye-catching-image/

102あづみ ◆WYiR3RzL3U 2018/01/23(火) 16:32:23.70ID:9Ax8QTMK
WordPress カテゴリー別に人気記事ランキングを表示するプラグイン − WPP Plus Widget

アイキャッチ画像
https://gameusers.org/dev/blog/wp-content/uploads/2018/01/ec-wpp-plus-widget-popular.jpg

当ブログでサイドバー(スマホの場合はページ下部)に表示している
アイキャッチ画像(サムネイル)付きの人気記事ランキングと新着記事を表示する方法を紹介していきます。

プラグインをインストールして、コードをコピペするだけで
このブログと同じランキングを利用することができるようになります。

HTML や CSS の知識がある方は、自分でデザインをカスタマイズすることも可能です。
この記事では、カスタマイズ方法についても解説していきますので
ぜひ参考にしながらチャレンジしてみてください。

記事
https://gameusers.org/dev/blog/wpp-plus-widget-popular/

103あづみ ◆WYiR3RzL3U 2018/01/24(水) 18:34:08.50ID:FhvGf0Tt
WordPress カテゴリー別に新着記事を表示するプラグイン − WPP Plus Widget

アイキャッチ画像
https://gameusers.org/dev/blog/wp-content/uploads/2018/01/ec-wpp-plus-widget-new.png

検索サイトからのユーザーが目的の記事を読んだ後、
他の記事も読んでくれたら嬉しいですよね。
そういう考えで「最近の投稿」をサイドバーに掲載している方は多いと思います。

ですが、ここで自分のブログについて考えてみてください。
検索サイトから来てくれた方が必要としている記事が「最近の投稿」にしっかりと並んでいると思いますか?
テーマをひとつに絞って書かれてるブログの場合は問題ないと思います。
ただ雑多な内容になってしまっているブログの場合は
アクセスしてくれた方が求める記事へのリンクを的確に提供できているとは言えないのではないでしょうか。

記事
https://gameusers.org/dev/blog/wpp-plus-widget-new/

104あづみ ◆WYiR3RzL3U 2018/01/30(火) 18:19:43.29ID:oM3Kg40K
WordPressの画像をモーダルウィンドウで表示しよう!

アイキャッチ画像
https://gameusers.org/dev/blog/wp-content/uploads/2018/01/ec-wordpress-modal-window.jpg

WordPress の記事に追加した画像をクリック(タップ)すると、
ブラウザに画像が読み込まれて大きく表示されますよね?

その際、画像をクリックする → ブラウザに画像が読み込まれる
→ 元のページに戻るという経緯をたどりますが、元のページに戻った時に
再度ページの読み込みが発生するので、ページの表示に時間がかかってしまいます。

パソコンからのアクセスの場合は回線が速いので、あまり気になりませんが
スマートフォンからアクセスしたときに、再度ページを読み込むと
時間がかかるので読者にストレスを与えることになってしまいます。

そこでおすすめしたいのが、モーダルウィンドウでの画像表示です。

記事
https://gameusers.org/dev/blog/wordpress-modal-window/

105Name_Not_Found2018/01/31(水) 10:35:29.31ID:???
やりすぎ防犯パトロール、特定人物を尾行監視 2009年3月19日19時7分配信 ツカサネット新聞
http://headlines.yahoo.co.jp/hl?a=20090319-00000026-tsuka-soci

この記事で問題になった通称やりすぎ防パトは、創価学会と警察署が引き起こしていたようです

掻い摘んで説明すると

・創価学会は、町内会や老人会、PTA、商店会等の住民組織に関し、学会員が役員になるよう積極的に働きかける運動を
 90年代末から開始し、結果、多くの住民組織で役員が学会員という状況が生まれた

・防犯パトロールの担い手は地域の住民と住民組織で、防犯活動に関する会議や協議会には、住民組織の代表に役員が出席する為
 防犯活動や防パトに、創価学会が間接的に影響力を行使可能となった

・防パトは住民が行う為、住民が不審者や要注意人物にでっち上げられるトラブルが起きていたが
 創価学会はその緩さに目をつけ、住民組織を握っている状況を利用し、嫌がらせ対象者を不審者や要注意人物にでっち上げ
 防パトに尾行や監視、付き纏いをさせるようになった

・防パトは地元警察署との緊密な連携により行われる為、創価学会は警察署幹部を懐柔して取り込んでしまい
 不審者にでっち上げた住民への嫌がらせに署幹部を経由して警察署を加担させるようになった

・主に当該警察署勤務と考えられる創価学会員警察官を動かし、恐らく非番の日に、職権自体ないにもかかわらず
 私服警官を偽装させて管轄内を歩いて回らせ、防犯協力をお願いしますと住民に協力を求めて回り
 防犯とは名ばかりの、単なる嫌がらせを住民らに行わせた(防犯協力と称し依頼して回っていた警察官らの正体は恐らく所轄勤務の学会員警察官)
 ※これに加えて防犯要員が同様のお願いをして回る

・こうして防犯パトロールを悪用し、住民を欺いて嫌がらせをさせつつ、創価学会自体も会員らを動員し、組織的な嫌がらせを連動して行った

つまり警察署に勤務する学会員警察官、警察署幹部、創価学会が通称やりすぎ防犯パトロールの黒幕

詳細は下記スレをご覧下さい
やりすぎ防犯パトロールは創価学会と警察署の仕業だった
https://rio2016.5ch.net/test/read.cgi/bouhan/1516500769/

106あづみ ◆WYiR3RzL3U 2018/02/03(土) 17:17:51.66ID:iOCvlFCm
結構めんどくさい記事だったのですが、シェアボタンにも関係するので頑張って書きました。
All in One SEO Packを使ってる方は、よかったら参考にしてください。


WordPress ? All in One SEO Packの使い方&設定を徹底解説!翻訳付き
https://gameusers.org/dev/blog/all-in-one-seo-pack/


WordPress ? All in One SEO Pack ? XMLサイトマップの設定方法
https://gameusers.org/dev/blog/all-in-one-seo-pack-xml-sitemap/


WordPress ? All in One SEO Pack ? ソーシャルメディアの設定方法
https://gameusers.org/dev/blog/all-in-one-seo-pack-social-media/

107あづみ ◆WYiR3RzL3U 2018/02/16(金) 18:33:58.25ID:ybdPmUwO
ついでに投稿ページの設定方法も解説しておきました


WordPress ? All in One SEO Pack ? 投稿ページの設定方法

アイキャッチ画像
https://gameusers.org/dev/blog/wp-content/uploads/2018/02/ec-aiosp-post-settings.jpg

All in One SEO Pack の基本的な設定が終わったら、次は実際に投稿するときの設定について学んでいきましょう。

記事
https://gameusers.org/dev/blog/all-in-one-seo-pack-post-settings/

108あづみ ◆WYiR3RzL3U 2018/02/17(土) 17:31:10.29ID:7dIwuVqU
シェアボタンにウィジェット機能を追加しました
サイドバーに表示できるのでシェアボタンが常に目に入るようになります


Game Users Share Buttons v1.3.0 更新情報

ウィジェットを追加しました。ウィジェットを利用すると
サイドバーにシェアボタンを表示できるようになります。

また編集タブのTop設定・Bottom設定で
添付ファイルページにシェアボタンを表示するか表示しないかの設定を行えるようにしました。

記事
https://gameusers.org/dev/blog/game-users-share-buttons-v1-3-0/

新着レスの表示
レスを投稿する