Browse Library
Sign In Start Free Trial
Close icon Search icon
Account
Browse Library Sign In Start Free Trial

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying Learning Magento Theme Development
  • Table Of Contents Toc
Learning Magento Theme Development

Learning Magento Theme Development

By : Richard Carter
3 (2)
Buy this Book
close
close
Learning Magento Theme Development

Learning Magento Theme Development

3 (2)
By: Richard Carter
Buy this Book

Overview of this book

This book is for web designers and developers with existing knowledge of CSS, HTML, and XML, who wish to learn more about Magento-specific theming techniques. Some knowledge of PHP may be useful, but is not necessary.
Table of Contents (10 chapters)
close
close
close
Preface
Icon
Preface
Icon
What this book covers
Icon
What you need for this book
Icon
Who this book is for
Icon
Conventions
Icon
Reader feedback
Icon
Customer support
Lock Free Chapter
1
1. Introduction to Magento and Magento Themes
Icon
1. Introduction to Magento and Magento Themes
Icon
What is a Magento theme?
Icon
Magento terminology
Icon
Magento websites, stores, and store views
Icon
Magento theme files
Icon
Magento theme hierarchy
Icon
Summary
2
2. Magento Theming Basics
Icon
2. Magento Theming Basics
Icon
Creating a new Magento theme
Icon
Enabling a Magento theme
Icon
Changing your Magento store's logo
Icon
Customizing your store's favorites icon (favicon)
Icon
Customizing Magento's product watermark image
Icon
Customizing Magento's product placeholder images
Icon
Using the Magento Template Path Hints
Icon
Summary
3
3. Magento Templates
Icon
3. Magento Templates
Icon
Providing layout style for your Magento theme
Icon
Customizing your Magento store's header
Icon
Customizing Magento's search box
Icon
Adding a static block to a Magento template
Icon
Customizing your Magento store's footer
Icon
Customizing your store's checkout and cart
Icon
Summary
4
4. Magento Layout
Icon
4. Magento Layout
Icon
Adding local.xml to your Magento theme
Icon
Using layout to change your default Magento page template
Icon
Changing a page's layout using Magento's CMS tool
Icon
Adding a static block to a page using the Magento layout
Icon
Changing the ordering of blocks in Magento's sidebar
Icon
Removing unnecessary blocks from Magento's sidebar
Icon
Customizing the home page's layout
Icon
Adding new product block to the home page
Icon
Summary
5
5. Social Media and Magento
Icon
5. Social Media and Magento
Icon
Integrating a Twitter feed into your Magento store
Icon
Integrating a Facebook Like Box into your Magento store
Icon
Including social share buttons in your product pages
Icon
Integrating product videos from YouTube into the product page
Icon
Summary
6
6. Advanced Magento Theming
Icon
6. Advanced Magento Theming
Icon
Adding a custom print style sheet to your Magento store
Icon
Using locales to translate phrases in your store
Icon
Using Google Web Fonts and @font-face
Icon
Styling Magento's layered navigation
Icon
Creating a custom 404 "not found" error page
Icon
Using snippets to enhance search engine listings
Icon
Summary
7
7. Magento Theming for Mobile and Tablet Devices
chevron up
Icon
7. Magento Theming for Mobile and Tablet Devices
Icon
Using CSS media queries to create breakpoints for different device widths
Icon
Making images responsive for your Magento theme
Icon
Developing responsive navigation
Icon
Adding mobile icons for Windows and Apple devices
Icon
Summary
8
8. Magento E-mail Templates
Icon
8. Magento E-mail Templates
Icon
Working with Magento e-mail templates
Icon
Changing the e-mail template logo
Icon
Changing the color scheme of your Magento transaction e-mail templates
Icon
Altering variables in Magento e-mail templates
Icon
Adding a static block to a Magento transactional e-mail template
Icon
Integrating the MailChimp subscription form into your Magento store
Icon
Integrating the Campaign Monitor subscription form into your Magento store
Icon
Summary
9
Index
Icon
Index

Chapter 7. Magento Theming for Mobile and Tablet Devices

So far, your new Magento theme has focused on building a custom design for your store for devices with larger screens, such as desktop computers and laptops. In this chapter, you will start customizing your Magento theme for devices with different screen sizes, such as smartphones and tablet computers. We will cover the following topics:

  • Using CSS media queries to create breakpoints for different device widths
  • Making images responsive for your Magento theme
  • Developing responsive navigation for your Magento theme
  • Adding mobile homepage icons for Windows and Apple devices to your Magento theme
Visually different images
CONTINUE READING
83
Tech Concepts
36
Programming languages
73
Tech Tools
Icon Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.
Icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Icon 50+ new titles added per month and exclusive early access to books as they are being written.
Learning Magento Theme Development
End of Section 7
Next Section
notes
bookmark Notes and Bookmarks search Search in title playlist Add to playlist font-size Font size

Change the font size

margin-width Margin width

Change margin width

day-mode Day/Sepia/Night Modes

Change background colour

Close icon Search
Country selected
Close icon Your notes and bookmarks

Confirmation

Modal Close icon
claim successful
Order Page Read Now

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY

Submit Your Feedback

Modal Close icon
Modal Close icon
Modal Close icon