TwitterボタンをTurbolinksに対応
TwitterボタンをTurbolinksに対応した時のメモ。
TwitterボタンをTurbolinksに対応
twttr_events_bound = false $ -> loadTwitterSDK -> bindTwitterEventHandlers() unless twttr_events_bound bindTwitterEventHandlers = -> $(document).on 'turbolinks:load', renderTweetButtons twttr_events_bound = true renderTweetButtons = -> $('.twitter-share-button').each -> button = $(this) button.attr('data-url', document.location.href) unless button.data('url')? button.attr('data-text', document.title) unless button.data('text')? twttr.widgets.load() loadTwitterSDK = (callback) -> $.getScript("//platform.twitter.com/widgets.js", callback)
Turbolinks Compatibilityに掲載されているコードでは、Turbolinks5の環境では動かなかったので読み込み方法を修正。
変更前
$(document).on 'page:load', renderTweetButtons
変更後
$(document).on 'turbolinks:load', renderTweetButtons
参考
NginxをLet's EncryptでSSL対応
NginxをLet's EncryptでSSL対応した時のメモ。
python2.7をインストール
$ sudo yum install centos-release-SCL $ sudo yum install python27 phthon27-python-tools $ sudo yum install dialog $ sudo su # vi ~/.bashrc
~/.bashrc
source /opt/rh/python27/enable
# source ~/.bashrc
証明書を発行
$ cd /usr/local $ sudo git clone https://github.com/certbot/certbot $ cd certbot/ $ ./certbot-auto --help $ sudo su # ./certbot-auto certonly --webroot -w /usr/share/nginx/html -d example.com -d www.example.com --email mail@example.com
備考
さくらの記事を参考に作業を進めて自分の環境では完了時点でQualys SSL ReportでBの評価だった。そのあとnginxにセキュリティ項目の設定を追加して現在はA+の評価。
参考記事
- Cent OS 6で手軽にPython 2.7を使う方法
- Let's Encrypt の使い方
- Let’s EncryptのSSL証明書で、安全なウェブサイトを公開
- Certbot not creating acme-challenge folder
- Let’s Encrypt で証明書を発行して運用するための nginx の設定
- 光の速さのWEBサーバー(nginx)をlet's encryptでSSL化及びHTTP/2化。ついでにセキュリティ評価をA+にする。
- Guide to Deploying Diffie-Hellman for TLS
- et’s Encrypt+NginxでSSLの評価をA+にしたい!
Googleのガイドラインから気になった部分をメモ
詳細な記事
参考記事:「詳細な記事」機能に表示される記事 - Search Console ヘルプ
schema.org の Article マークアップ
Google では通常、ユーザーにとってより有用な検索結果が表示されるように、ページに記述されているメタデータを可能な限り解釈しようとします。その際、schema.org の Article マークアップ(リンク先は英語)がページに実装されていると大変役立ちます。特に、次の属性が含まれていればなお効果的です。
- headline
- alternativeHeadline
- image(注: この画像はクロールやインデックス登録に対応できる必要があります)
- description
- datePublished
- articleBody
ページ指定と正規化
複数のページで構成されるコンテンツの場合、rel=next や rel=prev を使用した適切なページ指定マークアップを行うことにより、Google のアルゴリズムはそれらの記事の範囲を正しく特定できるようになります。
(中略)
個別のページまたは「すべて表示」ページのいずれかにリンクする rel=canonical を設定します(複数のページで構成されるコンテンツの 1 ページ目にはリンクさせないでください)。詳しくは、ページ指定と正規化をご覧ください。
ロゴ
ウェブマスターは、ウェブサイトに使用するロゴに関するヒントを次の 2 通りの方法で Google に提供することができます
参考記事:Official Google Webmaster Central Blog: Using schema.org markup for organization logos
アフィリエイト プログラム
参考記事:Affiliate programs - Search Console Help
内容の薄いアフィリエイト サイトの例
商品アフィリエイト リンクを含むページで、商品の説明とレビューを元の販売者から直接コピーし、独自のコンテンツや付加価値を加えることなくそのまま掲載しているもの。
良質なアフィリエイト サイト
アフィリエイト プログラムに参加しているサイトが必ずしもすべて内容の薄いアフィリエイト サイトであるわけではありません。たとえば、独自の商品レビュー、評価、商品比較などを行って付加価値を提供している良質なアフィリエイト サイトもあります。アフィリエイト プログラムに参加しているサイトを差別化してランキングを高めるために次のような方法が役立ちます。
差別化の方法
- サイトのごく一部にのみアフィリエイト プログラムのコンテンツを掲載する。
- ユーザーが元の販売者のサイトに直接アクセスせずにこのサイトにアクセスしようとする理由を考える。元の販売者が提供しているコンテンツを転載するだけでなく実質的な付加価値を提供するサイトにします。
- アフィリエイト プログラムを選択する際、サイトの対象ユーザーに適した商品のカテゴリを選択する。サイトのコンテンツに合ったアフィリエイト プログラムを選択することで、サイトの付加価値が高まり、Google の検索結果でのランキングが高くなり、アフィリエイト プログラムから収益を得られる可能性が高くなります。たとえば、アルプスのハイキングに関するサイトには、事務用品ではなくハイキング関連書籍の販売業者との提携が適しています。
- ウェブサイトでユーザーのコミュニティを形成する。熱心な読者の獲得に役立ち、サイトのテーマに関する情報が集まる場を作ることができます。たとえば、ディスカッション フォーラム、ユーザー レビュー、ブログなどでユーザーに独自のコンテンツと付加価値を提供できます。
- 常に最新で関連性の高いコンテンツを提供する。テーマに一貫性のある最新の情報を提供すると、コンテンツを Googlebot がクロールし、ユーザーがクリックする可能性が高まります。
Railsで多対多の関連をチェックボックスで設定
Railsで多対多の関連をチェックボックスで設定する時のメモ
Model
$ rails g model post name:string $ rails g model tag name:string $ rails g model post_tag post:references tag:references
post.rb
class Post < ActiveRecord::Base has_many :post_tags has_many :tags, through: :post_tags end
tag.rb
class Tag < ActiveRecord::Base has_many :post_tags has_many :posts, through: :post_tags end
post_tag.rb
class PostTag < ActiveRecord::Base belongs_to :post belongs_to :tag end
View
= collection_check_boxes(:post, :tag_ids, Tag.all, :id, :name) do |t| = t.label(class: "checkbox-inline") { t.check_box + t.text }
Controller
def post_params params.require(:post).permit(:name, {:tag_ids => []}) end
参考
RailsのテンプレートをBootstrapが適用されたslimファイルで生成する
RailsのテンプレートをBootstrapが適用されたslimファイルで生成する時のメモ。
RailsのテンプレートをBootstrapが適用されたslimファイルで生成
gem 'slim-rails' gem 'html2slim' gem 'bootstrap-sass' gem 'bootstrap-generators'
$ bundle install $ rails generate bootstrap:install -f
既存のファイルがある場合
erbファイルをslimファイルに変換
$ for i in app/views/**/*.erb; do erb2slim $i ${i%erb}slim && rm $i; done
参考
Carrierwave使用環境でCapistranoでデプロイした時のメモ
Capistranoでデプロイした時に、Carrierwaveでアップロードした画像ディレクトリが削除(上書き)されてしまった時のメモ。
アップローダファイルを修正
下記のリンクを参考にアップローダファイルを修正
def store_dir "system/uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}" end
nginxの設定修正
example.com.conf
location ~ ^/system/ { root /var/www/example.com/current/public; }
(nginxの設定は勉強中です)
nginxをリスタート後、不具合の解消を無事に確認できました。
その他
画像のアップロード先を変更しない場合の対処法は、動作未確認ですが下記の方法が参考になるかと思いました。
How to get Capistrano to ignore upload directories (Carrierwave)
参考リンク
#18 テストデータを作成
ある程度動くようになってきたので、デバッグを兼ねた動作確認のためにテストデータを生成します。
- Gemfile
gem 'ffaker'
- seeds.rb
10.times do User.create(name: FFaker::Name.name, email: FFaker::Internet.safe_email, password: FFaker::Internet.password) end
$ rake db:seed
同じ要領で他のテストデータも作成しました。