Ecmall Pendant Development Example Two

The following example describes how to quickly add a pendant, but does not make changes to the code in the system, the basic reference to the method of image_ad hanging pieces.

The first step:

Understanding the homepage template structure

Home file Structure	Include hearder.html	Contains header files that contain the top logo area
	<div class= "keyword" >...</div>	Search bar Area
	<div class= "Content" >...</div>	The first is the content area, which contains the left and right regions, and the right area is divided into the middle and right chunks.
	<div class= "Ad_banner" area= "banner" widget_type= "area" >...</div>	Banner Ad Area
	<div class= "Content" >...</div>	The second is the lower area, also the left and right areas, the general placement of classification and product mix module
	<div class= "Content" area= "Bottom_down" widget_type= "area" >...</div>	Bottom Friendship Link Area
	Include footer.html	Contains the bottom file, which mainly contains copyright information

Once you understand the template structure, it is much easier to add the area of the pendant. Navigation below the banner is usually the site's golden location, but the default is not, so I <div class= "keyword" >...</div> below a div area, as follows <div class= "Ad_banner" Area= "Nav_banner" widget_type= "area" >...</div>

It's easy to add another area, but consider whether the layout will break, preferably by looking at the CSS settings under theme.

Step Two:

Enter the mall system External/widgets directory, you will see the default has come with a lot of plug-ins, the Image_ad downloaded, renamed to Xxx_ad or a friendly name

Directory structure	Config.html	Set up a pendant page when you manage templates in the background
	Widget.html	Home Template Widget HTML snippet page
	main.widget.php	Model source file containing the modeling of the pendant class
	widget.info.php	Defining array information for a pendant

Modify widget.info.php information, array array[name] to be the same as the name of the pendant directory

Step Three: modify the class XXX extends Basewidget in the main.widget.php file

• The _get_data () function is to get the image address and link
• Parse_config ($input) function is a background setting when returning a picture address
• _upload_image () is a picture upload function

Fourth Step:

Config.html is the background management plug-in HTML code files, basically do not move, widget.html files according to their own templates and CSS settings, such as modifying the Div class, whether to show links and so on.

finally , basically a simple ad pendant is completed and will add a custom area to the index.html and the pendant directory to upload.

finally , edit the template in the background, add the pendant to the newly added area in the template, and set it up

Transfer from http://my.oschina.net/u/779687/blog/118419

Ecmall Pendant Development Example II (EXT)