Merge pull request #2153 from consul/social-meta-tags

Social meta tags

app/views/shared/_social_media_meta_tags.html.erb

@@ -1,20 +1,20 @@
 <!-- Twitter -->
-<meta name="twitter:card" content="summary" />
-<meta name="twitter:site" content="@consul_dev" />
-<meta name="twitter:title" content="<%= social_title %>" />
-<meta name="twitter:description" content="<%= social_description %>" />
-<meta name="twitter:image" content="<%= image_url local_assigns[:twitter_image_url] || image_path_for('social_media_icon_twitter.png') %>" />
+<meta name="twitter:card" content="summary"/>
+<meta name="twitter:site" content="<%= setting['twitter_handle'] %>"/>
+<meta name="twitter:title" content="<%= local_assigns[:social_title] || setting['meta_title'] %>"/>
+<meta name="twitter:description" content="<%= local_assigns[:social_description] || setting['meta_description'] %>"/>
+<meta name="twitter:image" content="<%= root_url + (local_assigns[:twitter_image_url] || 'social_media_icon_twitter.png') %>"/>
 <!-- Facebook OG -->
-<meta id="ogtitle" property="og:title" content="<%= social_title %>"/>
+<meta id="ogtitle" property="og:title" content="<%= local_assigns[:social_title] || setting['meta_title'] %>"/>
 <% if setting['url'] %>
-  <meta property="article:publisher" content=<%= setting['url'] %>/>
+  <meta property="article:publisher" content="<%= setting['url'] %>"/>
 <% end %>
 <% if setting['facebook_handle'] %>
   <meta property="article:author" content="https://www.facebook.com/<%= setting['facebook_handle'] %>"/>
 <% end %>
 <meta property="og:type" content="article"/>
 <meta id="ogurl" property="og:url" content="<%= social_url %>"/>
-<meta id="ogimage" property="og:image" content="<%= image_url local_assigns[:og_image_url] || image_path_for('social_media_icon.png') %>"/>
+<meta id="ogimage" property="og:image" content="<%= root_url + (local_assigns[:og_image_url] || 'social_media_icon.png') %>"/>
 <meta property="og:site_name" content="<%= setting['org_name'] %>"/>
-<meta id="ogdescription" property="og:description" content="<%= social_description %>"/>
+<meta id="ogdescription" property="og:description" content="<%= local_assigns[:social_description] || setting['meta_description'] %>"/>
 <meta property="fb:app_id" content="<%= Rails.application.secrets.facebook_key %>"/>

app/views/welcome/index.html.erb

@@ -4,6 +4,11 @@
   <%= render "shared/canonical", href: root_url %>
 <% end %>
 
+<% provide :social_media_meta_tags do %>
+  <%= render "shared/social_media_meta_tags",
+              social_url: root_url %>
+<% end %>
+
 <div class="jumbo highlight">
   <div class="row">
     <div class="small-12 medium-9 small-centered column text-center">

config/locales/en/settings.yml

@@ -48,6 +48,7 @@ en:
     map_zoom: Zoom
     mailer_from_name: Origin email name
     mailer_from_address: Origin email address
+    meta_title: "Site title (SEO)"
     meta_description: "Site description (SEO)"
     meta_keywords: "Keywords (SEO)"
     verification_offices_url: Verification offices URL

config/locales/es/settings.yml

@@ -48,6 +48,7 @@ es:
     map_zoom: Zoom
     mailer_from_name: Nombre email remitente
     mailer_from_address: Dirección email remitente
+    meta_title: "Título del sitio (SEO)"
     meta_description: "Descripción del sitio (SEO)"
     meta_keywords: "Palabras clave (SEO)"
     verification_offices_url: URL oficinas verificación

db/dev_seeds.rb

@@ -55,6 +55,7 @@ section "Creating Settings" do
   Setting.create(key: 'comments_body_max_length', value: '1000')
   Setting.create(key: 'mailer_from_name', value: 'CONSUL')
   Setting.create(key: 'mailer_from_address', value: 'noreply@consul.dev')
+  Setting.create(key: 'meta_title', value: 'CONSUL')
   Setting.create(key: 'meta_description', value: 'Citizen Participation and Open Government Application')
   Setting.create(key: 'meta_keywords', value: 'citizen participation, open government')
   Setting.create(key: 'verification_offices_url', value: 'http://oficinas-atencion-ciudadano.url/')

db/seeds.rb

@@ -65,6 +65,7 @@ Setting["org_name"] = "CONSUL"
 Setting["place_name"] = "CONSUL-land"
 
 # Meta tags for SEO
+Setting["meta_title"] = nil
 Setting["meta_description"] = nil
 Setting["meta_keywords"] = nil
 

spec/features/proposals_spec.rb

@@ -153,8 +153,8 @@ feature 'Proposals' do
     proposal = create(:proposal)
 
     visit proposal_path(proposal)
-    expect(page.html).to include "<meta name=\"twitter:title\" content=\"#{proposal.title}\" />"
-    expect(page.html).to include "<meta id=\"ogtitle\" property=\"og:title\" content=\"#{proposal.title}\"/>"
+    expect(page).to have_css "meta[name='twitter:title'][content=\"#{proposal.title}\"]", visible: false
+    expect(page).to have_css "meta[property='og:title'][content=\"#{proposal.title}\"]", visible: false
   end
 
   scenario 'Create' do

spec/features/social_media_meta_tags_spec.rb

@@ -0,0 +1,54 @@
+require 'rails_helper'
+
+feature 'Social media meta tags' do
+
+  context 'Setting social media meta tags' do
+
+    let(:meta_keywords) { 'citizen, participation, open government' }
+    let(:meta_title) { 'CONSUL TEST' }
+    let(:meta_description) { 'Citizen Participation and Open Government Application' }
+    let(:twitter_handle) { '@consul_test' }
+    let(:url) { 'http://consul.dev' }
+    let(:facebook_handle) { 'consultest' }
+    let(:org_name) { 'CONSUL TEST' }
+
+    before do
+      Setting['meta_keywords'] = meta_keywords
+      Setting['meta_title'] = meta_title
+      Setting['meta_description'] = meta_description
+      Setting['twitter_handle'] = twitter_handle
+      Setting['url'] = url
+      Setting['facebook_handle'] = facebook_handle
+      Setting['org_name'] = org_name
+    end
+
+    after do
+      Setting['meta_keywords'] = nil
+      Setting['meta_title'] = nil
+      Setting['meta_description'] = nil
+      Setting['twitter_handle'] = nil
+      Setting['url'] = 'http://example.com'
+      Setting['facebook_handle'] = nil
+      Setting['org_name'] = 'CONSUL'
+    end
+
+    scenario 'Social media meta tags partial render settings content' do
+
+      visit root_path
+
+      expect(page).to have_css 'meta[name="keywords"][content="'+ meta_keywords + '"]', visible: false
+      expect(page).to have_css 'meta[name="twitter:site"][content="'+ twitter_handle + '"]', visible: false
+      expect(page).to have_css 'meta[name="twitter:title"][content="'+ meta_title + '"]', visible: false
+      expect(page).to have_css 'meta[name="twitter:description"][content="' + meta_description + '"]', visible: false
+      expect(page).to have_css 'meta[name="twitter:image"][content="http://www.example.com/social_media_icon_twitter.png"]', visible: false
+      expect(page).to have_css 'meta[property="og:title"][content="'+ meta_title + '"]', visible: false
+      expect(page).to have_css 'meta[property="article:publisher"][content="' + url + '"]', visible: false
+      expect(page).to have_css 'meta[property="article:author"][content="https://www.facebook.com/' + facebook_handle + '"]', visible: false
+      expect(page).to have_css 'meta[property="og:url"][content="http://www.example.com/"]', visible: false
+      expect(page).to have_css 'meta[property="og:image"][content="http://www.example.com/social_media_icon.png"]', visible: false
+      expect(page).to have_css 'meta[property="og:site_name"][content="' + org_name + '"]', visible: false
+      expect(page).to have_css 'meta[property="og:description"][content="' + meta_description + '"]', visible: false
+    end
+  end
+
+end