Learn how to use the Astra Theme to make a WordPress Website – 6fc Live

Leave a Comment / Knowledge base / By

The Astra Theme is a versatile and beginner-friendly WordPress theme, ideal for creating landing pages, blogs, or e-commerce websites like your WooCommerce store “My Shop” (from your “Blog Page” guide) featuring products such as “Flying Ninja” (from your “Creating Products” guide). With over 1.6 million users, Astra offers fast, lightweight, SEO-friendly starter templates and native support for page builders like Elementor and Beaver Builder. The 6fc Live Educate WordPress video, hosted by Aisha, demonstrates how to install, set up, and customize Astra, including its Pro features. This guide provides a step-by-step process based on the video, enriched with web sources.

Sponsored Note: The video is sponsored by Appmaker, a plugin that converts WooCommerce sites into native Android/iOS apps. Get 30% off for the first 200 signups at appmaker.xyz (per video).

Why Use Astra Theme?

  • Versatility: Supports blogs, e-commerce, e-learning, restaurants, and more with 180+ starter templates (per video).
  • Performance: Lightweight (~50 KB), scoring 90+ on GTmetrix, with local Google Fonts loading (per video).
  • Customization: Highly customizable with free and Pro ($47+/year) versions, supporting Elementor, Beaver Builder, and Gutenberg.
  • SEO-Friendly: Optimized for search engines, complementing Yoast SEO (from your “Yoast SEO” guide).
  • WooCommerce Fit: Enhances stores with wishlist (from your “Wishlist” guide) or payment gateways like Paytm (from your “Paytm” guide).
  • Limitations: Free version has basic customization; premium templates and advanced features (e.g., sticky headers) require Pro or Premium plans.

Step 1: Install and Activate Astra Theme

  1. Install Theme:
    • In your WordPress dashboard, go to Appearance > Themes > Add New.
    • Search for Astra (per video, by Brainstorm Force).
    • Click Install, then Activate (per video).
    • Alternative: Download from wordpress.org/themes/astra/ and upload via Appearance > Themes > Add New > Upload Theme.
  2. Verify Installation:
    • Confirm: Astra appears as the active theme under Appearance > Themes.
    • Check for Astra Options in the sidebar or under Appearance (per video).
  3. Install Starter Templates Plugin (Optional):
    • If the “Get Started” dialog doesn’t appear, go to Appearance > Astra Options and install the Starter Templates plugin (per video).
    • Activate the plugin to access pre-built templates.

Step 2: Set Up Astra with a Starter Template

  1. Access Astra Options:
    • Go to Appearance > Astra Options and click Get Started (per video).
    • Alternatively, go to Appearance > Starter Templates if already installed.
  2. Choose Page Builder:
    • Select a page builder (e.g., Elementor, per video; also supports Gutenberg, Beaver Builder).
    • Click Build Your Website Now (per video).
  3. Select Template:
    • Browse the template library (e.g., blog, e-commerce, restaurant, per video).
      • Free templates: Available without cost.
      • Premium templates: Require Astra Premium (distinct from Astra Pro, per video).
    • Choose a free blog template (per video) or another relevant option (e.g., e-commerce for “My Shop”).
    • Click the template to preview.
  4. Customize Template:
    • Select a Color Theme (e.g., stock theme, per video).
    • Choose a Font Pair (e.g., default or custom, per video).
    • Click Continue.
  5. Enter Site Information:
    • Provide details (e.g., site name, logo, per video).
    • Click Submit and Build My Website (per video).
    • Wait 5-10 minutes for the template to import all pages (per video).
  6. Preview Site:
    • Click View Website to see the imported site (per video).
    • Confirm: Pages (e.g., Home, Blog, Contact) are fully imported and customizable.

Step 3: Customize Astra (Free Version)

  1. Access Customization:
    • Go to Appearance > Astra Options or Appearance > Customize (per video).
  2. Header Builder:
    • In Appearance > Customize > Header Builder, edit three rows (per video):
      • Primary Menu: Adjust menu items (e.g., Home, Shop).
      • Social Icons: Reposition (e.g., drag to top or left, per video).
    • Set layout (e.g., full width or content width, per video).
    • Click Publish to save changes.
  3. Footer Builder:
    • In Appearance > Customize > Footer Builder, edit three rows (per video).
      • Free version limits additions; basic widgets (e.g., copyright) are editable.
    • Click Publish to save.
  4. Blog Layouts:
    • In Appearance > Astra Options, choose blog layouts (e.g., grid, list, per video).
    • Adjust settings (e.g., show/hide excerpts).
  5. Preview Changes:
    • Visit your site (e.g., yoursite.com) to confirm header, footer, and blog updates.

Step 4: Install and Activate Astra Pro

  1. Purchase Astra Pro:
    • Visit wp-astra.com (per video) and purchase Astra Pro ($47/year or $249 lifetime).
    • Download the zip file after purchase (per video).
  2. Install Astra Pro Plugin:
    • In WordPress, go to Plugins > Add New > Upload Plugin.
    • Upload the Astra Pro zip file (e.g., astra-pro.zip, per video).
    • Click Install Now, then Activate (per video).
  3. Activate Modules:
    • Go to Appearance > Astra Options.
    • Enable desired modules (e.g., Header Builder, Footer Builder, Typography, per video).
    • Click Save Changes.

Step 5: Customize with Astra Pro Features

  1. Enhanced Header Builder:
    • In Appearance > Customize > Header Builder, add advanced elements (per video):
      • Transparent Header: Enable for overlay effect.
      • Sticky Header: Stick header on scroll (e.g., above header, per video).
      • Animation: Choose slide or fade (per video).
      • Device Support: Enable for desktop, mobile, or both (per video).
    • Add buttons or widgets (e.g., social buttons, per video).
    • Click Publish.
  2. Enhanced Footer Builder:
    • In Appearance > Customize > Footer Builder, add elements (per video):
      • Social Buttons: Add icons with URLs (e.g., Facebook, Twitter).
      • Widgets: Add lists or custom widgets (e.g., menu list, per video).
    • Adjust layout and URLs, then click Publish.
  3. Breadcrumbs:
    • In Appearance > Customize > Breadcrumbs, enable breadcrumbs for navigation (per video).
      • Example: Shows “Home > Blog > Post” on blog pages.
      • Position: After title or custom (per video).
      • Disable on specific pages (e.g., Contact, per video).
    • Click Publish.
  4. Typography and Colors:
    • In Appearance > Customize > Typography, adjust fonts (not available in free version, per video).
    • In Appearance > Customize > Colors, change theme colors (e.g., primary color to #0073aa).
    • Click Publish.
  5. Performance:
    • In Appearance > Customize > Performance, enable Load Google Fonts Locally to speed up the site (per video).
      • Benefit: Reduces load time on low internet connections.
  6. Scroll to Top:
    • In Appearance > Customize > Scroll to Top, enable a button for quick navigation (per video).
    • Customize icon and position, then click Publish.
  7. Other Pro Features:
    • White Labeling: Replace Astra branding (for agencies).
    • Advanced Blog Layouts: Custom grids, infinite scroll.
    • Custom Menus: Enhanced menu options.
    • Note: Astra Premium (separate plan, $59+/year) unlocks premium templates, not Pro features (per video).

Step 6: Test and Optimize

  1. Test Website:
    • Visit your site in incognito mode (e.g., yoursite.com).
    • Confirm:
      • Template pages load correctly (e.g., Blog, Shop).
      • Header/footer updates (e.g., sticky header, social buttons).
      • Breadcrumbs display on relevant pages (e.g., Blog > Post).
      • Scroll to top button works.
    • Test on mobile to ensure responsiveness.
  2. Optimize Performance:
    • Cache site with plugins like WP Rocket, excluding dynamic pages (from your “Backup and Migration” guide).
    • Verify speed with GTmetrix (target: 90+ score).
    • Compress images with Smush or ShortPixel (from your “Image Optimization” guide, if applicable).
  3. Troubleshoot:
    • Template Not Importing?:
      • Verify Starter Templates plugin is active.
      • Check internet connection for import.
      • Clear cache (from your “Backup and Migration” guide).
    • Pro Features Missing?:
      • Ensure Astra Pro is activated and modules are enabled.
      • Validate license in Appearance > Astra Options.
    • Theme Conflicts?: Test with default plugins (disable others temporarily).
    • Contact support at wp-astra.com/support/ or check wp-astra.com/docs/.

Step 7: Enhance with Integrations

  1. Astra Features:
    • Free:
      • 180+ starter templates (limited to free ones).
      • Basic header/footer builder, blog layouts.
      • SEO-friendly and lightweight (~50 KB).
    • Pro ($47+/year):
      • Advanced header/footer builders (sticky, transparent).
      • Typography, colors, breadcrumbs, scroll to top.
      • White labeling, custom menus, performance options.
    • Premium ($59+/year): Unlocks premium templates (not Pro features, per video).
    • Purchase at wp-astra.com/pricing/.
  2. WooCommerce Integration:
    • Enhance “My Shop” with Astra’s e-commerce templates.
    • Add a wishlist with TI WooCommerce Wishlist (from your “Wishlist” guide).
    • Secure payments with Paytm, Razorpay, or UPI QR Code (from your “Paytm,” “Razorpay,” or “UPI Payment” guides).
    • Promote products with NotificationX or Icegram Express (from your “NotificationX” or “Announcement Bar” guides).
  3. Custom Styling:
    • Add CSS in Appearance > Customize > Additional CSS:.ast-header { background: #0073aa; color: #fff; } .ast-footer { border-top: 1px solid #ddd; padding: 20px; } .ast-scroll-top { background: #0073aa; border-radius: 50%; } @media (max-width: 600px) { .ast-header { padding: 10px; } }
    • Align with your branding or Neve’s design principles (from your “Neve” guide).
  4. Additional Integrations:
    • Elementor: Use for drag-and-drop editing (per video).
    • Yoast SEO: Optimize pages (from your “Yoast SEO” guide).
    • Wordfence: Secure the site (from your “Malware Removal” guide).
    • Zoom Meetings: Add virtual events (from your “Zoom” guide).

Step 8: Best Practices

  1. Site Setup:
    • Choose a template aligned with your goal (e.g., e-commerce for “My Shop”).
    • Use Elementor for advanced customization (per video).
  2. User Experience:
    • Enable breadcrumbs for navigation (per video).
    • Use sticky headers for accessibility.
    • Ensure mobile responsiveness with Astra’s layouts.
  3. Testing:
    • Test all pages (e.g., Blog, Shop, Contact) in incognito mode.
    • Verify Pro features (e.g., sticky header, scroll to top).
    • Check template compatibility with WooCommerce or Elementor.
  4. Performance:
    • Enable local Google Fonts (Pro feature, per video).
    • Cache site and optimize images for speed.
    • Monitor with GTmetrix for 90+ scores.

Pro Tips

  • Engagement: Promote your site with a Welcome Bar (from your “Sticky Menu” guide) or Join.chat for support (from your “Join.chat” guide).
  • Security: Protect with Limit Login Attempts Reloaded or Wordfence (from your “Limit Login Attempts” or “Malware Removal” guides).
  • Compliance: Use GDPR Cookie Consent for tracking (from your “Cookie Notice” guide).
  • SEO: Optimize with Yoast SEO to boost rankings (from your “Yoast SEO” guide).
  • Backup: Save customizations with UpdraftPlus (from your “Backup and Migration” guide).
  • Export Content: Archive pages with Aspose.Words Exporter (from your “Aspose Exporter” guide).

Congratulations!

You’ve built a professional WordPress website with the Astra Theme and 6fc Live! Your site, whether a blog or e-commerce store like “My Shop,” is now fast, SEO-friendly, and highly customizable. For advanced features or premium templates, explore Astra Pro or Premium (wp-astra.com). Combine with your other guides (e.g., “Wishlist,” “Paytm,” “Yoast SEO”) for a robust platform. Need help with setup, customization, or troubleshooting? Comment below or visit wp-astra.com/support/!

Leave a Comment

Your email address will not be published. Required fields are marked *

Get your website at just ₹499/Year

enroll today

Subscribe

Website Demo

About

Follow Me

Facebook-f Twitter Pinterest Youtube