Blog Structure

This directory contains the blog posts for the Vegas Corporan website.

Structure

blog/
  index.vue                          # Blog listing page
  premium-cigars-online-switzerland/ # Individual blog post
    index.vue
  [future-post-slug]/                # Future posts follow this pattern
    index.vue

Adding a New Blog Post

To add a new blog post:

1. Create a new directory with a SEO-friendly slug (e.g., how-to-choose-cigar):

   mkdir src/pages/blog/your-post-slug
   

2. Create an index.vue file inside the new directory with the following structure:

   <script setup lang="ts">
   const { locale } = useI18n()
   const router = useRouter()
   
   // Set the appropriate language
   locale.value = 'en' // or 'es', 'de', 'it', 'fr'
   
   // SEO Meta Tags
   useHead({
     title: 'Your Post Title | Blog',
     meta: [
       {
         name: 'description',
         content: 'Your post description...',
       },
       // ... more meta tags
     ],
     link: [
       { rel: 'alternate', hreflang: 'es', href: 'https://vegascorporan.ch/es/blog/your-post-slug' },
       { rel: 'alternate', hreflang: 'en', href: 'https://vegascorporan.ch/blog/your-post-slug' },
       { rel: 'alternate', hreflang: 'de', href: 'https://vegascorporan.ch/de/blog/your-post-slug' },
       { rel: 'alternate', hreflang: 'it', href: 'https://vegascorporan.ch/it/blog/your-post-slug' },
       { rel: 'alternate', hreflang: 'fr', href: 'https://vegascorporan.ch/fr/blog/your-post-slug' },
       { rel: 'alternate', hreflang: 'x-default', href: 'https://vegascorporan.ch/blog/your-post-slug' },
     ],
   })
   
   onMounted(() => {
     window.scrollTo(0, 0)
   })
   </script>
   
   <template>
     <main class="min-h-screen bg-gray-50">
       <article class="container mx-auto max-w-4xl px-4 py-12">
         <!-- Your blog post content -->
       </article>
     </main>
   </template>
   

3. Add the post to the blog listing by editing src/pages/blog/index.vue:

   • Add a new entry to the blogPosts array:

   {
     slug: 'your-post-slug',
     title: 'Your Post Title',
     excerpt: 'A brief description of your post...',
     publishedDate: '2024-12-16', // YYYY-MM-DD format
     tags: ['Tag1', 'Tag2', 'Tag3'],
     image: '/path/to/image.jpg', // Optional
   }
   

URL Structure

• Blog listing: /blog
• Individual post: /blog/[post-slug]
• Multi-language: /es/blog/[post-slug], /de/blog/[post-slug], etc.

Best Practices

1. Use SEO-friendly slugs: Use lowercase, hyphens instead of spaces, and keep them descriptive
2. Include proper meta tags: Title, description, keywords, and Open Graph tags
3. Add hreflang tags: For all 5 language versions (en, es, de, it, fr)
4. Use semantic HTML: Proper heading hierarchy (h1, h2, h3)
5. Include images: Add relevant images with proper alt text
6. Update the listing: Always add new posts to the blog index page

Example Post Structure

<template>
  <main class="min-h-screen bg-gray-50">
    <article class="container mx-auto max-w-4xl px-4 py-12">
      <header class="mb-8">
        <nav class="mb-6">
          <button @click="router.push('/blog')">
            Back to Blog
          </button>
        </nav>
        <h1>Your Post Title</h1>
        <div class="flex items-center gap-4 text-gray-600 text-sm">
          <div>Published: {{ date }}</div>
          <div>Tags: {{ tags }}</div>
        </div>
      </header>
      
      <div class="prose prose-lg max-w-none">
        <div class="bg-white rounded-lg shadow-md p-8">
          <!-- Your content here -->
        </div>
      </div>
      
      <!-- Call to Action -->
      <div class="bg-#846e48 text-white rounded-lg p-8 mt-8 text-center">
        <!-- CTA content -->
      </div>
    </article>
  </main>
</template>