Learning Magento Theme Development电子书

Learning Magento Theme Development

Table of Contents

Learning Magento Theme Development

Credits

About the Author

About the Reviewers

www.PacktPub.com

Support files, eBooks, discount offers, and more

Why subscribe?

Free access for Packt account holders

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Downloading the example code

Errata

Piracy

Questions

1. Introduction to Magento and Magento Themes

What is a Magento theme?

Magento's default themes

The default theme

The category page layout

The list mode layout

Checkout

The blank theme

The iPhone theme

The modern theme

Magento terminology

Scope in Magento

Magento websites, stores, and store views

Using multiple stores in Magento

Using multiple store views in Magento

Magento theme files

Skin files

Layout files

Template files

Locale files

Packages

Magento theme hierarchy

Summary

2. Magento Theming Basics

Creating a new Magento theme

Enabling a Magento theme

Changing your Magento store's logo

Customizing your store's favorites icon (favicon)

Customizing Magento's product watermark image

Using product images in Magento

Customizing Magento's product placeholder images

Using the Magento Template Path Hints

Summary

3. Magento Templates

Providing layout style for your Magento theme

Customizing your Magento store's header

Providing CSS for Magento's navigation dropdowns

Altering the header.phtml template

Customizing Magento's search box

Adding a static block to a Magento template

Creating a new static block

Inserting the static block into a template

Customizing your Magento store's footer

Listing all top-level categories in your Magento store

Customizing your store's checkout and cart

Styling the cart page

Styling the checkout page

Summary

4. Magento Layout

Adding local.xml to your Magento theme

Using layout to change your default Magento page template

Types of blocks within Magento

Changing a page's template using the XML layout

Changing a page's layout using Magento's CMS tool

Adding a static block to a page using the Magento layout

Assigning a static block to a page in Magento's CMS

Changing the ordering of blocks in Magento's sidebar

Repositioning a block below a specific block

Reordering a block above all other blocks

Reordering a block below all other blocks

Removing unnecessary blocks from Magento's sidebar

Customizing the home page's layout

Adding new product block to the home page

Marking products as new in Magento

Using XML layout to add the New Products block to your store's home page

Summary

5. Social Media and Magento

Integrating a Twitter feed into your Magento store

Creating your Twitter widget

Embedding your Twitter feed into a Magento template

Integrating a Facebook Like Box into your Magento store

Getting the embedding code from Facebook

Adding the embed code into your Magento templates

Including social share buttons in your product pages

Styling the product page a little further

Integrating AddThis

Integrating product videos from YouTube into the product page

Product attributes in Magento

Creating a new attribute for your video field

Adding a YouTube video to a product using the new attribute

Inserting the video attribute into your product view template

Summary

6. Advanced Magento Theming

Adding a custom print style sheet to your Magento store

Using locales to translate phrases in your store

Creating a Magento locale file

The translate function

Using Google Web Fonts and @font-face

Including Google Web Font in your store's theme

Referencing Google Web Font in your Magento theme's style sheet

Styling Magento's layered navigation

Enabling layered navigation in Magento categories

Assigning attributes for layered navigation

Creating a custom 404 "not found" error page

Altering the error page's content

Using snippets to enhance search engine listings

Summary

7. Magento Theming for Mobile and Tablet Devices

Using CSS media queries to create breakpoints for different device widths

Adding the meta viewport element to your Magento theme

Adding a CSS media query to your style sheet

Making images responsive for your Magento theme

Developing responsive navigation

Adding mobile icons for Windows and Apple devices

Adding an Apple home icon to your Magento store

Adding a Windows icon to your Magento store

Summary

8. Magento E-mail Templates

Working with Magento e-mail templates

Changing the e-mail template logo

Sending test transactional e-mails

Changing the color scheme of your Magento transaction e-mail templates

Loading a Magento e-mail template

Editing Magento e-mail templates through your theme

Assigning an e-mail template to a transaction in Magento

Altering variables in Magento e-mail templates

Magento Insert Variable pop up

Using the customer's first name only in e-mail templates

Adding a static block to a Magento transactional e-mail template

Creating the static block

Adding the static block to the e-mail template

Integrating the MailChimp subscription form into your Magento store

Integrating the Campaign Monitor subscription form into your Magento store

Summary

Index