Mastering Magento Theme Design. Magento is the super-capable open source e-commerce platform that’s number one for a reason. By using this book to optimize your know-how, you’ll be acquiring the ultimate in e-tail expertise for yourself and - Helion
ebook
Autor: Andrea SaccaTytuÅ‚ oryginaÅ‚u: Mastering Magento Theme Design. Magento is the super-capable open source e-commerce platform that’s number one for a reason. By using this book to optimize your know-how, you’ll be acquiring the ultimate in e-tail expertise for yourself and
ISBN: 9781783288243
stron: 310, Format: ebook
Data wydania: 2014-04-25
Księgarnia: Helion
Cena książki: 152,10 zł (poprzednio: 169,00 zł)
Oszczędzasz: 10% (-16,90 zł)
Osoby które kupowaÅ‚y "Mastering Magento Theme Design. Magento is the super-capable open source e-commerce platform that’s number one for a reason. By using this book to optimize your know-how, you’ll be acquiring the ultimate in e-tail expertise for yourself and ", wybieraÅ‚y także:
- Windows Media Center. Domowe centrum rozrywki 66,67 zł, (8,00 zł -88%)
- Ruby on Rails. Ćwiczenia 18,75 zł, (3,00 zł -84%)
- Przywództwo w świecie VUCA. Jak być skutecznym liderem w niepewnym środowisku 58,64 zł, (12,90 zł -78%)
- Scrum. O zwinnym zarządzaniu projektami. Wydanie II rozszerzone 58,64 zł, (12,90 zł -78%)
- Od hierarchii do turkusu, czyli jak zarządzać w XXI wieku 58,64 zł, (12,90 zł -78%)
Spis treści
Mastering Magento Theme Design. Magento is the super-capable open source e-commerce platform that’s number one for a reason. By using this book to optimize your know-how, you’ll be acquiring the ultimate in e-tail expertise for yourself and your clients eBook -- spis treÅ›ci
- Mastering Magento Theme Design
- Table of Contents
- Mastering Magento Theme Design
- 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
- Support files, eBooks, discount offers, and more
- Preface
- What this book covers
- What you need for this book
- Prerequisites
- Who this book is for
- Conventions
- Reader feedback
- Customer support
- Downloading the example code
- Errata
- Piracy
- Questions
- 1. Introducing Magento Theme Design
- The basic concepts of a Magento theme
- The Magento base theme
- The hierarchy of files and the fall-back system
- The Magento base theme
- The structure of a Magento theme
- Design packages and design themes
- Directory 1 app
- The layout subdirectory
- Templates
- Locales
- Creating new translatable entries
- Directory 2 skin
- Structural blocks and content blocks
- CMS blocks and page
- CMS blocks
- CMS pages
- Magento variables
- Widgets
- Creating the theme
- Starting with the app folders
- Creating the skin folders
- Creating the necessary files
- Disabling the cache
- Activating the theme
- Tips and tricks
- Template path hint
- Disabling the WYSIWYG editor
- Summary
- The basic concepts of a Magento theme
- 2. Creating a Responsive Magento Theme with Bootstrap 3
- An introduction to Bootstrap
- Downloading Bootstrap (the current Version 3.1.1)
- Downloading and including jQuery
- Integrating the files into the theme
- Declaring the .js files in local.xml
- Declaring the CSS files in local.xml
- Removing and adding the style.css file
- Adding conditional JavaScript code
- A quick recap of our local.xml file
- Defining the main layout design template
- Defining the HTML5 boilerplate for main templates
- Developing the header
- Creating the top header
- CMS block links
- Creating the CMS block with the links
- Declaring the CMS block in the local.xml file
- Declaring the CMS block with a PHP statement in header.phtml
- The right part of the top header
- CMS block links
- Creating the main header
- Logo
- The top cart
- Creating the top header
- Creating the navigation bar
- The top menu bar
- Search
- Developing the footer
- Creating the CMS blocks from the admin panel
- Adding the newsletter block
- Summary
- 3. Customizing Our Custom Theme
- Developing the home page
- Configuring the structure of the home page
- Creating the slider row
- Creating the CMS block for the carousel
- Creating the CMS block for the banners
- Creating the CMS home page from the admin panel
- Customizing the look and feel of the home page with CSS
- Creating the content row
- Customizing the left sidebar
- Removing the default blocks from the sidebar
- Creating a vertical navigation menu on the sidebar
- Customizing the main content
- Adding a block with some products of a specific category
- Customizing the other pages of the theme
- The products grid
- The product page
- File paths and handles for the other sections of the theme
- Summary
- Developing the home page
- 4. Adding Incredible Effects to Our Theme
- Introducing CSS3 transitions
- Multiple property changes
- The CSS3 transition properties
- Creating an animated cart in the header
- Customizing the topcart.phtml file
- Customizing the CSS of the cart
- Styling the carts content with CSS
- Creating a stunning CSS3 3D flip animation
- Planning the hover animation
- The HTML code of list-home.phtml
- Creating the CSS animation
- Creating a custom product images gallery
- Planning the work
- Integrating prettyPhoto into Magento
- Downloading prettyPhoto
- Integrating prettyPhoto JS and CSS
- Customizing the media.phtml code
- Initializing prettyPhoto
- Creating a nice image swap effect for when you hover the cursor over a thumbnail
- Adding a custom font to our theme
- Sources to find free and premium web-safe font
- Google fonts
- Font Squirrel
- Adobe TypeKit
- Integrating a Google font in our theme
- Sources to find free and premium web-safe font
- Adding a custom icon font to our theme
- Summary
- Introducing CSS3 transitions
- 5. Making the Theme Fully Responsive
- Our goal
- Using specific CSS3 media queries
- Large devices (.container width 1170 px)
- Medium devices (.container width 970 px)
- Tablet devices (.container width 750 px)
- Smartphones
- Optimizing the theme for multiple devices
- Testing the responsiveness of a website
- Optimizing the top bar of the header
- Fixing the logo row
- Fixing the menu bar
- Fixing the main content column
- Fixing the products grid
- Adjusting the footer
- Tips and tools for responsive coding
- Hiding the unnecessary blocks for lower resolutions
- Flexible images
- Initial scale meta tag (iPhone)
- Adding mobile icons
- Summary
- 6. Making the Theme Socially Ready
- Getting started with social media integration
- Integrating the social plugin in the product page
- Integrating the code in the product page
- Facebook's Like button
- Twitter's Tweet button
- Pinterest's Pin button
- The Google+ button
- The + button
- Adding the Facebook Like box to the left sidebar
- Installing the Like box on your site
- Summary
- 7. Creating a Magento Widget
- Getting started with Magento widgets
- Developing a widget
- Creating an empty module
- Adding the widget to the CMS page
- Creating a widget with options
- Adding options to our widget.xml
- Creating the frontend widget block
- Adding the widget in the admin panel
- Summary
- 8. Creating a Theme Admin Panel
- Creating the theme options module
- Activating the module
- Creating the module helper
- Creating the configuration file config.xml
- Creating the options file system.xml
- Getting started with options fields
- Overviewing the System.xml fields
- Creating an input text
- Creating textarea
- Creating a dropdown with Yes/No values
- Creating a dropdown with Enable/Disable values
- Creating a dropdown with custom values
- Creating a File Upload option field
- Creating the advanced admin options panel
- Creating a custom dropdown field
- Interfacing the admin panel with the theme
- Customizing the frontend
- Getting the value of an input text field
- Conditional options
- Accessing a Yes/No dropdown
- Getting the uploaded image file
- Customizing the frontend
- Advanced options features
- A dependent field
- Adding JavaScripts inside the comment tag
- Creating a visual color picker in admin
- Validate options
- Defining default values for options fields
- A quick recap of the theme's option panel
- Summary
- Creating the theme options module
- 9. Customizing the Backend of Magento
- An overview of the admin design
- Changing the default admin panel
- Installing the module to change the folder path
- Creating a custom Magento admin theme
- Creating the custom.css file
- Checking the CSS overriding
- Changing the logo
- Using a different logo name or extension
- Creating CSS3 gradients without images
- Changing the background color of the header
- Customizing the navigation
- Customizing the footer
- Customizing other objects
- Creating a custom login page
- Creating the custom login.phtml file
- Creating the login form
- Styling the login form
- Adding the alert message if the data is incorrect
- A quick recap of the complete form.phtml file
- Customizing the retrieve password form
- Installing the Magento Go admin theme
- Summary
- 10. Packaging and Selling the Theme
- Collecting and placing all the folders and files under one folder
- Creating the live demo preview
- The performance of the sever
- Sample products
- Searching for royalty-free photos for the theme
- iStock
- BIGSTOCK
- PhotoDune
- The Envato asset library
- Creating the documentation of the theme
- A simple example of the ThemeForest documentation
- The Documenter tool
- Some tips to write better documentation
- Packaging the theme
- Selling the theme on ThemeForest
- My personal experience
- Theme pricing
- Inserting the theme on the Magento Connect site
- Support and updates
- Fixing the bugs and adding new features
- Supporting final users
- Summary
- A. Conclusions and Credits
- Official Magento resources
- The Magento commerce website
- The Magento design guide
- Magento Front End certification
- Magento 2
- Useful websites on Magento
- Excellence Magento blog
- Fabrizio Branca blog
- Bubble codes by Johann Reinke
- Inchoo's blog
- Tuts plus Magento tutorials
- Smashing magazine
- Free resources for design, UI, and web design
- Responsive design
- UI UIX resources
- Animations
- Fonts
- Social media
- Photo stocks resources
- Free resources
- Selling your theme
- Conclusions
- Thank you
- Official Magento resources
- Index