Fix image and media tags

resources/lang/en/fieldsets.php

@@ -7,6 +7,9 @@
   'general:site_name_separator' => 'Site name separator',
   'general:site_name_separator:instructions' => 'The character that separates the title of the site name page.',
 
+  'general:image_asset_container' => 'Asset container',
+  'general:image_asset_container:instructions' => 'The container to use for the images and media.',
+
   'meta:meta_section' => 'Activated Meta tags',
   'meta:meta_section:instructions' => 'Activate all the meta tags you need.',
 

resources/views/metatags.antlers.html

@@ -117,21 +117,27 @@
   {{ if og_determiner }}<meta property="og:determiner" content="{{ og_determiner }}" />{{ /if }}
   {{ if og_description }}<meta property="og:description" content="{{ og_description }}" />{{ /if }}
   {{ if og_image }}
-    {{ og_image }}
+    {{ foreach:og_image as="ogimage" }}
+    {{ ogimage }}
     <meta property="og:image" content="{{ permalink }}" />
     <meta property="og:image:width" content="{{ width }}" />
     <meta property="og:image:height" content="{{ height }}" />
-    {{ /og_image }}
+    {{ /ogimage }}
+    {{ /foreach:og_image }}
   {{ /if }}
   {{ if og_audio }}
-    {{ og_audio }}
+    {{ foreach:og_audio as="ogaudio" }}
+    {{ ogaudio }}
     <meta property="og:audio" content="{{ permalink }}" />
-    {{ /og_audio }}
+    {{ /ogaudio }}
+    {{ /foreach:og_audio }}
   {{ /if }}
   {{ if og_video }}
-    {{ og_video }}
+    {{ foreach:og_video as="ogvideo" }}
+    {{ ogvideo }}
     <meta property="og:video" content="{{ permalink }}" />
-    {{ /og_video }}
+    {{ /ogvideo }}
+    {{ /foreach:og_video }}
   {{ /if }}
 
   {{ if og_type == 'article' }}
@@ -277,9 +283,11 @@
 <!-- PINTEREST -->
 {{ fields }}
   {{ if pinterest_image }}
-    {{ pinterest_image }}
-    <meta property="og:image" content="{{ url }}" />
-    {{ /pinterest_image}}
+    {{ foreach:pinterest_image as="pinteresetimage" }}
+    {{ pinteresetimage }}
+    <meta property="og:image" content="{{ permalink }}" />
+    {{ /pinteresetimage }}
+    {{ /foreach:pinterest_image}}
   {{ /if }}
   {{ if pinterest_see_also }}
     {{ pinterest_see_also }}
@@ -315,9 +323,11 @@
       {{ /pinterest_color_map }}
     {{ /if }}
     {{ if pinterest_color_image }}
-      {{ pinterest_color_image }}
+      {{ foreach:pinterest_color_image as="pinterestcolorimage" }}
+      {{ pinterestcolorimage }}
       <meta property="product:color:image" content="{{ url }}" />
-      {{ /pinterest_color_image }}
+      {{ /pinterestcolorimage }}
+      {{ /foreach:pinterest_color_image }}
     {{ /if }}
   {{ /if }}
 {{ /fields }}
@@ -327,16 +337,18 @@
 <!-- TWITTER -->
 {{ fields }}
   {{ if twitter_type }}<meta property="twitter:card" content="{{ twitter_type }}" />{{ /if }}
-  {{ if twitter_type != 'app' }}
+  {{ if twitter_type == 'summary' }}
     {{ if twitter_site }}<meta property="twitter:site" content="{{ twitter_site }}" />{{ /if }}
     {{ if twitter_site_id }}<meta property="twitter:site:id" content="{{ twitter_site_id }}" />{{ /if }}
     {{ if twitter_creator }}<meta property="twitter:creator" content="{{ twitter_creator }}" />{{ /if }}
     {{ if twitter_creator_id }}<meta property="twitter:creator:id" content="{{ twitter_creator_id }}" />{{ /if }}
     {{ if twitter_description }}<meta property="twitter:description" content="{{ twitter_description }}" />{{ /if }}
     {{ if twitter_title }}<meta property="twitter:title" content="{{ twitter_title }}" />{{ /if }}
     {{ if twitter_image }}
-      <meta property="twitter:image" content="{{ twitter_image.url }}" />
-      {{ if twitter_image.alt }}<meta property="twitter:image:alt" content="{{ twitter_image.alt }}" />{{ /if }}
+      {{ twitter_image }}
+      <meta property="twitter:image" content="{{ permalink }}" />
+      {{ if alt }}<meta property="twitter:image:alt" content="{{ alt }}" />{{ /if }}
+      {{ /twitter_image }}
     {{ /if }}
   {{ /if }}
   {{ if twitter_type == 'player' }}

src/Http/Controllers/SettingsController.php

@@ -6,6 +6,7 @@
 use Gioppy\StatamicMetatags\Settings;
 use Illuminate\Http\Request;
 use Illuminate\Routing\Controller;
+use Statamic\Facades\AssetContainer;
 use Statamic\Facades\Blueprint;
 use Statamic\Facades\Fieldset;
 use Statamic\Support\Arr;
@@ -45,6 +46,15 @@ public function update(Request $request) {
   }
 
   private function blueprint() {
+    /**
+     * @var $assetContainers \Illuminate\Support\Collection
+     */
+    $assetContainers = AssetContainer::all();
+    $assetContainersOptions = $assetContainers->mapWithKeys(function (\Statamic\Assets\AssetContainer $item) {
+      return [$item->url() => $item->title()];
+    })
+      ->toArray();
+
     return Blueprint::make()
       ->setContents([
         'sections' => [
@@ -68,7 +78,21 @@ private function blueprint() {
                   'type' => 'text',
                   'width' => 50,
                 ]
-              ]
+              ],
+              [
+                'handle' => 'image_asset_container',
+                'field' => [
+                  'display' => __('statamic-metatags::fieldsets.general:image_asset_container'),
+                  'instructions' => __('statamic-metatags::fieldsets.general:image_asset_container:instructions'),
+                  'type' => 'select',
+                  'multiple' => false,
+                  'clearable' => false,
+                  'searchable' => true,
+                  'push_tags' => false,
+                  'cast_booleans' => false,
+                  'options' => $assetContainersOptions
+                ]
+              ],
             ]
           ],
           'meta' => [

src/Settings.php

@@ -39,7 +39,7 @@ public function values() {
 
   public function excludedMeta() {
     return collect(Yaml::file($this->path())->parse())
-      ->only(['site_name', 'site_name_separator'])
+      ->only(['site_name', 'site_name_separator', 'image_asset_container'])
       ->all();
   }
 

src/Tags/MetatagsTags.php

@@ -7,6 +7,7 @@
 use Gioppy\StatamicMetatags\DefaultMetatags;
 use Gioppy\StatamicMetatags\Settings;
 use Illuminate\Support\Str;
+use Statamic\Facades\Asset;
 use Statamic\Fields\Value;
 use Statamic\Support\Arr;
 use Statamic\Tags\Tags;
@@ -30,13 +31,39 @@ public function index() {
       return Str::startsWith($key, $settingsMeta);
     })
       ->filter()
+      ->filter(function ($item) {
+        if (is_array($item) && array_key_exists('value', $item) && $item['value'] === null) {
+          return false;
+        }
+
+        return true;
+      })
       ->all();
 
     // Merge default values with page metatags
     $fields = collect($defaultValues)
       ->filter()
       ->merge($pageFields)
       ->map(function ($field, $key) {
+        // Filed with media
+        if (Str::endsWith($key, ['image', 'video', 'audio'])) {
+          // Default value, it seems that media value from default settings will be a simple string array...
+          if (is_array($field) && array_key_exists(0, $field)) {
+            return collect($field)->map(function ($item) {
+              return is_array($item) ?
+                new Value($item) :
+                new Value(Asset::findByUrl($this->assetContainerPath($item)));
+            })->toArray();
+          }
+
+          // ...otherwise, value from field inside a collection is an Asset!
+          if (is_array($field) && array_key_exists('path', $field)) {
+            return new Value($field);
+          }
+
+          return new Value(Asset::findByUrl($this->assetContainerPath($field)));
+        }
+
         // Field with single option
         if (is_array($field) && array_key_exists('value', $field) && !is_null($field['value'])) {
           return new Value($field['value']);
@@ -66,4 +93,10 @@ public function index() {
       ]
     ]);
   }
+
+  private function assetContainerPath($asset) {
+    $settings = Settings::make();
+    $containerPath = $settings->excludedMeta()['image_asset_container'];
+    return "$containerPath/$asset";
+  }
 }