Open Graph support

Author: malte-christian

app/components/post-meta.vue

@@ -0,0 +1,38 @@
+<template>
+
+    <div class="uk-form-horizontal">
+
+        <div class="uk-form-row">
+            <label for="form-class" class="uk-form-label">{{ 'Title' | trans }}</label>
+            <div class="uk-form-controls">
+                <input id="form-class" class="uk-form-width-large" type="text" v-model="post.data.meta['og:title']">
+            </div>
+        </div>
+
+        <div class="uk-form-row">
+            <label for="form-class" class="uk-form-label">{{ 'Description' | trans }}</label>
+            <div class="uk-form-controls">
+                <textarea id="form-class" class="uk-form-width-large" rows="5" type="text" v-model="post.data.meta['og:description']"></textarea>
+            </div>
+        </div>
+
+    </div>
+
+</template>
+
+<script>
+
+    module.exports = {
+
+        section: {
+            label: 'Meta',
+            priority: 100
+        },
+
+        props: ['post']
+
+    };
+
+    window.Post.components['post-meta'] = module.exports;
+
+</script>

index.php

@@ -163,6 +163,7 @@
 
         'view.scripts' => function ($event, $scripts) {
             $scripts->register('link-blog', 'blog:app/bundle/link-blog.js', '~panel-link');
+            $scripts->register('post-meta', 'blog:app/bundle/post-meta.js', '~post-edit');
         }
 
     ]

src/Controller/SiteController.php

@@ -133,7 +133,10 @@ public function postAction($id = 0)
         return [
             '$view' => [
                 'title' => __($post->title),
-                'name' => 'blog/post.php'
+                'name' => 'blog/post.php',
+                'og:title' => $post->get('meta.og:title') ?: $post->title,
+                'og:description' => $post->get('meta.og:description') ?: $post->excerpt,
+                'og:image' =>  $post->get('image.src') ? App::url()->getStatic($post->get('image.src'), [], 0) : false
             ],
             '$comments' => [
                 'config' => [

webpack.config.js

@@ -9,7 +9,8 @@ module.exports = [
             "comments": "./app/views/comments",
             "post": "./app/views/post",
             "posts": "./app/views/posts",
-            "link-blog": "./app/components/link-blog.vue"
+            "link-blog": "./app/components/link-blog.vue",
+            "post-meta": "./app/components/post-meta.vue"
         },
         output: {
             filename: "./app/bundle/[name].js"