Merge branch 'astro-v3' of https://github.com/widgeter/astrowind into dev

README.md

@@ -5,7 +5,7 @@
 
 🌟 _Most *starred* & *forked* Astro theme in 2022_. 🌟
 
-**AstroWind** is a free and open-source template to make your website using **[Astro 3.0](https://astro.build/blog/astro-2/) + [Tailwind CSS](https://tailwindcss.com/)**. Ready to start a new project and designed taking into account web best practices.
+**AstroWind** is a free and open-source template to make your website using **[Astro 3.0](https://astro.build/) + [Tailwind CSS](https://tailwindcss.com/)**. Ready to start a new project and designed taking into account web best practices.
 
 ## Features
 
@@ -58,7 +58,7 @@
 
 ## Getting started
 
-**AstroWind** tries to give you quick access to creating a website using [Astro 3.0](https://astro.build/blog/astro-2/) + [Tailwind CSS](https://tailwindcss.com/). It's a free theme focuses on simplicity, good practices and high performance.
+**AstroWind** tries to give you quick access to creating a website using [Astro 3.0](https://astro.build/) + [Tailwind CSS](https://tailwindcss.com/). It's a free theme focuses on simplicity, good practices and high performance.
 
 Very little vanilla javascript is used only to provide basic functionality so that each developer decides which framework (React, Vue, Svelte, Solid JS...) to use and how to approach their goals..
 

netlify.toml

@@ -1,6 +1,8 @@
 [build]
   publish = "dist"
   command = "npm run build"
+[build.processing.html]
+  pretty_urls = false
 [[headers]]
   for = "/assets/*"
   [headers.values]

src/content/post/astrowind-template-in-depth.mdx

@@ -37,8 +37,8 @@ The styling mechanism consists of the following files (all paths are prefixed wi
   header section. See next.
 </DListItem>
 <DListItem dt="layouts/Layout.astro">
-  This layout is used for all of the pages rendered by _AstroWind_. The contents of _tailwind.css_ and
+  This layout is used for all of the pages rendered by _AstroWind_. The contents of _tailwind.css_ and _CustomStyles.astro_ component,
-  _CustomStyles.astro_ component, described above, is injected into the html header.
+  described above, is injected into the html header.
 </DListItem>
 
 ### Dark Mode

src/content/post/get-started-website-with-astro-tailwind-css.md

@@ -1,5 +1,5 @@
 ---
-publishDate: 2023-01-12T00:00:00Z
+publishDate: 2023-08-12T00:00:00Z
 title: Get started with AstroWind to create a website using Astro and Tailwind CSS
 excerpt: Start your web journey with AstroWind – harness Astro and Tailwind CSS for a stunning site. Explore our guide now.
 image: https://images.unsplash.com/photo-1516996087931-5ae405802f9f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80

src/content/post/how-to-customize-astrowind-to-your-brand.md

@@ -1,5 +1,5 @@
 ---
-publishDate: 2023-01-06T00:00:00Z
+publishDate: 2023-08-06T00:00:00Z
 title: How to customize AstroWind template to suit your branding
 excerpt: Personalize AstroWind template for your brand. Our guide unlocks seamless customization steps for a unique online presence.
 image: https://images.unsplash.com/photo-1546984575-757f4f7c13cf?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80

src/content/post/landing.md

@@ -0,0 +1,148 @@
+---
+publishDate: 2023-07-15T00:00:00Z
+title: 'Mastering Landing Pages: Practical Guide for 2023'
+excerpt: Ever clicked on an ad and found yourself on a page that seemed to really want you to do something? Congratulations, you've landed on a Landing Page!
+image: https://images.unsplash.com/photo-1561069934-eee225952461?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80
+tags:
+  - landing-pages
+  - front-end
+  - resources
+---
+
+In the vast digital landscape, standing out is more than a desire—it's a necessity. Enter the world of Landing Pages, the unsung heroes of digital marketing. With the power of the AstroWind template, developed using Astro and Tailwind CSS, crafting these pages becomes even more intuitive. Let's dive deep into understanding, creating, and optimizing them.
+
+## Landing Pages Unveiled
+
+A **Landing Page** is a standalone web page, distinct from your main website, crafted with a singular objective: to convert visitors into actionable leads or sales. It's where a visitor "lands" post-clicking on a marketing link or ad.
+
+Imagine clicking on an ad for a limited-time discount on a popular shoe brand. Instead of landing on the brand's homepage, you're taken to a page showcasing the discounted shoes with a clear "Buy Now" button. That's a Landing Page in action, focusing your attention solely on the offer.
+
+## The Power of Precision
+
+Unlike a homepage brimming with diverse content, a Landing Page is laser-focused. It eliminates potential distractions like excessive navigation, ensuring the visitor's attention remains undivided. The result? Higher conversion rates and a more streamlined user experience.
+
+![Target](https://images.unsplash.com/photo-1596008194705-2091cd6764d4?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1639&q=80)
+
+Think of a Landing Page as a digital salesperson. Just as a salesperson would pitch a product without distractions, a Landing Page promotes an offer without unnecessary links or information. It's like walking into a store with a single product on display, making your choice straightforward.
+
+## Why Landing Pages Matter
+
+In today's digital rush, hoping customers stumble upon you is a strategy of the past. Landing Pages are the future. They:
+
+- **Guide Traffic**: Directing visitors seamlessly through the sales funnel.
+- **Boost ROI**: Maximizing returns on marketing investments.
+- **Personalize User Experience**: Tailoring content to specific audience segments.
+
+For instance, if you're launching a new fitness app, a well-crafted Landing Page can target individuals interested in health and wellness, offering them a free trial. This targeted approach ensures that those genuinely interested in fitness are the ones you're engaging with.
+
+## Crafting the Perfect Landing Page
+
+Every element of your Landing Page should resonate with its core objective. Here's what a high-converting Landing Page entails:
+
+- **Benefit-Centric Headline**: Your headline should instantly convey the value proposition.
+- **Engaging Imagery**: Visuals that complement and enhance the content.
+- **Compelling Copy**: Clear, concise, and persuasive text that speaks directly to the visitor's needs.
+- **Clear Call-to-Action (CTA)**: A standout button or link urging the visitor to take action.
+- **Minimalist Design**: A clutter-free layout that emphasizes the offer. For example, using a Tailwind CSS web template like AstroWind.
+- **Trust Indicators**: Testimonials, reviews, and badges that bolster credibility.
+
+Imagine browsing online for a writing course. You land on a page with a captivating headline: "Unlock the Writer Within." Below, there's an engaging image of a person writing, followed by persuasive text and a bright "Enroll Now" button. This Landing Page has effectively used its elements to entice you to sign up.
+
+## Homepage vs. Landing Page
+
+While both are pivotal, they serve distinct roles:
+
+- **Homepage**: Offers a panoramic view of your brand, catering to diverse visitor intents.
+- **Landing Page**: Zeros in on a single, specific action, be it signing up, purchasing, or downloading.
+
+Consider a popular online store. Their homepage might display various product categories, from electronics to clothing. However, if they're promoting a summer sale, the Landing Page would focus solely on summer products, urging visitors to "Shop the Summer Sale Now!"
+
+## The Art of Optimization
+
+The digital realm is ever-evolving. Regular tweaks based on analytics can ensure your Landing Page remains a conversion powerhouse. Embrace A/B testing to compare different versions and refine for optimal results.
+
+Let's say you have a Landing Page for a new skincare product. Version A uses an image of the product, while Version B showcases a video testimonial. A/B testing might reveal that Version B, with the video, has a 20% higher conversion rate. Such insights can be invaluable for future campaigns.
+
+## Landing Pages in Action
+
+Whether promoting a product launch, capturing emails for a newsletter, or driving registrations for an event, Landing Pages are versatile tools in your marketing toolkit. They're not just about capturing leads but nurturing and converting them.
+
+Presented below are several prevalent types of Landing Pages. Each link not only offers a prime example of its respective type but is also meticulously crafted in the form of a comprehensive guide. This ensures that you not only witness the best practices in action but also gain a step-by-step understanding of how to masterfully create each type.
+
+### [Lead Generation Landing Page](landing/lead-generation)
+
+**Purpose**: Designed primarily to capture user data, such as email addresses or contact details.
+
+**Content**: Typically features a form alongside a description of what the user will receive in return, be it an eBook, a webinar, or a free trial.
+
+**Focus**: Enticing visitors to provide their personal details by offering something valuable in return.
+
+**Key Differentiator**: Unlike "Click-through Landing Pages" that aim to lead users to another step, these aim to collect user data directly.
+
+**Example**: A digital marketing agency offering a free SEO audit in exchange for business contact details.
+
+### [Long-form Sales Landing Page](landing/sales)
+
+**Purpose**: Primarily designed to sell, aiming to persuade and convert visitors into customers.
+
+**Content**: Extensive, providing a wealth of information including product details, benefits, testimonials, success stories, guarantees, and bonuses.
+
+**Focus**: Uses narrative to present a problem and then offers the product or service as the solution, aiming to emotionally connect with the visitor.
+
+**Key Differentiator**: Unlike "Click-through Landing Pages", which warm up the visitor for a bigger commitment, these aim to close the sale directly on the page.
+
+**Example**: A weight loss program detailing an individual's journey, challenges faced, how the program helped, and why it's the ideal solution for others.
+
+### [Click-through Landing Page](landing/click-through)
+
+**Purpose**: Acts as an intermediary step, warming up visitors for a bigger commitment.
+
+**Content**: Provides essential details and benefits of an offer, urging visitors to click through to another page.
+
+**Focus**: To lead visitors to the final conversion point, be it a checkout page or a sign-up form.
+
+**Key Differentiator**: Unlike "Subscription Landing Pages" that aim for a recurring commitment, these lead to a one-time action.
+
+**Example**: An online store showcasing a new product's benefits, leading visitors to the purchase page.
+
+### [Product Details Landing Page](landing/product)
+
+**Purpose**: Designed to inform by providing specific details about a product or service.
+
+**Content**: Focuses on features, specifications, and benefits. May include high-quality images, detailed descriptions, demo videos, and user reviews.
+
+**Focus**: Presents the product or service transparently and attractively.
+
+**Key Differentiator**: While 'Long-form Sales Landing Pages' aim to persuade through narratives and overcoming objections, 'Product Details Landing Pages' focus on presenting the product or service in a clear and detailed manner.
+
+**Example**: A tech website detailing a new laptop's specifications, unique features, comparisons with previous models, and user reviews.
+
+### [Coming Soon or Pre-Launch Landing Page](landing/pre-launch)
+
+**Purpose**: Builds anticipation for an upcoming product, service, or event.
+
+**Content**: Often includes a countdown timer, teaser content, and an option to sign up for notifications.
+
+**Focus**: To generate buzz and capture early interest.
+
+**Key Differentiator**: Unlike other landing pages that present available offers, these promote something not yet accessible.
+
+**Example**: A game developer teasing their upcoming game release with sneak peeks and an option for early access.
+
+### [Subscription Landing Page](landing/subscription)
+
+**Purpose**: Encourages visitors to subscribe to a service, newsletter, or recurring product.
+
+**Content**: Highlights the benefits of subscribing, often offering special deals or exclusive content for subscribers.
+
+**Focus**: To secure a long-term commitment from the visitor.
+
+**Key Differentiator**: Unlike "Click-through Landing Pages" that lead to a one-time action, these aim for a recurring commitment.
+
+**Example**: A magazine promoting its monthly subscription, detailing exclusive articles and special subscriber-only benefits.
+
+## Conclusion
+
+In the digital marketing symphony, Landing Pages are the crescendo. They capture attention, evoke action, and drive results. As we sail into the future, ensuring your Landing Pages are optimized, relevant, and high-converting will be the key to digital success.
+
+Picture a world where every online interaction is personalized and focused. That's the power of Landing Pages. Whether you're a startup trying to gain traction or an established brand launching a new product, Landing Pages can be the catalyst for digital growth and engagement.

src/content/post/markdown-elements-demo-post.mdx

@@ -156,7 +156,7 @@ Ex amet id ex aliquip id do laborum excepteur exercitation elit sint commodo occ
 
 Sint ea anim ipsum ad commodo cupidatat do **exercitation** incididunt et minim ad labore sunt. Minim deserunt labore laboris velit nulla incididunt ipsum nulla. Ullamco ad laborum ea qui et anim in laboris exercitation tempor sit officia laborum reprehenderit culpa velit quis. **Consequat commodo** reprehenderit duis [irure](#!) esse esse exercitation minim enim Lorem dolore duis irure. Nisi Lorem reprehenderit ea amet excepteur dolor excepteur magna labore proident voluptate ipsum. Reprehenderit ex esse deserunt aliqua ea officia mollit Lorem nulla magna enim. Et ad ipsum labore enim ipsum **cupidatat consequat**. Commodo non ea cupidatat magna deserunt dolore ipsum velit nulla elit veniam nulla eiusmod proident officia.
 
-![Super wide](https://images.unsplash.com/photo-1471128466710-c26ff0d26143?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=MnwxfDB8MXxyYW5kb218MHx8fHx8fHx8MTY2MDc4MTk3Mw&ixlib=rb-1.2.1&q=80&utm_campaign=api-credit&utm_medium=referral&utm_source=unsplash_source&w=1080)
+![Super wide](https://images.unsplash.com/20/sand.JPG?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2071&q=80)
 
 _Proident sit veniam in est proident officia adipisicing_ ea tempor cillum non cillum velit deserunt. Voluptate laborum incididunt sit consectetur Lorem irure incididunt voluptate nostrud. Commodo ut eiusmod tempor cupidatat esse enim minim ex anim consequat. Mollit sint culpa qui laboris quis consectetur ad sint esse. Amet anim anim minim ullamco et duis non irure. Sit tempor adipisicing ea laboris `culpa ex duis sint` anim aute reprehenderit id eu ea. Aute [excepteur proident](#!) Lorem minim adipisicing nostrud mollit ad ut voluptate do nulla esse occaecat aliqua sint anim.
 

src/content/post/useful-resources-to-create-websites.md

@@ -1,5 +1,5 @@
 ---
-publishDate: 2023-01-09T00:00:00Z
+publishDate: 2023-08-09T00:00:00Z
 title: Useful tools and resources to create a professional website
 excerpt: Explore vital tools and resources for a sleek website. From design to functionality, our guide elevates your online presence.
 image: https://images.unsplash.com/photo-1637144113536-9c6e917be447?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1674&q=80