-1

这是我第一次尝试磁电机主题设计。我有一个看起来像这样的 HTML 模板(包括 css 和图像):

![我想创建并选择这样的magento主题][1]

我有这个主题的代码: HTML 代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>Plant Bulbs direct</title>
</head>
<body>
<div class="main_div">
<div class="inner_div">
<div class="header">
<div class="logo"><a href="#"><img src="images/logo.jpg" alt="" /></a></div>
<div class="logo_left">
<div class="top_link">
<ul>
<li><a href="#">Sign in</a></li>
<li><a href="#">Sign up</a></li>
<li><a href="#">Cookies</a></li>
<li><a href="#">T & Cs</a></li>
</ul>
<div class="search_div">
<input name="" class="input" placeholder="search" type="text" />
<div class="cart_icon"><a href="#"><img src="images/cart_img.jpg" alt="" /></a></div>       
</div>
<div class="nav">
<ul>
    <li><a href="#">About</a></li>
    <li><a href="#">Store News</a></li>
    <li><a href="#">Panting</a></li>
    <li><a href="#">Informationh</a></li>
    <li><a href="#">FAQS</a></li>
    <li><a href="#">Conact</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="banner">
</div>
<div class="main_div">
<div class="contant">
<div class="contant_left">
<div class="body_head">Welcome to plant Bulbs Direct</div>
<p>The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those      
interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum et Malorum" by Cicero    
are also reproduced in their exact original form, accompanied by English versions from 
the 1914 translation by H. Rackham. The standard chunk of Lorem Ipsum used since the   
1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de 
Finibus Bonorum et Malorum" by Cicero are also reproduced in their exact original form, 
accompanied by English versions from the 1914 translation .
</p>
<div class="product_part">
<div class="procuct_head">Specoal Offer:</div>
<div class="product">
<img src="images/product1.jpg" align="" />
<div class="produ_name"><strong>Triumph Red/Yellow</strong>
from <span style="color:#60b62a"><strong>$5.99</strong></span><br />
<span style="color:#519371">in stock</span><br />
<div class="font" style="float:left">Qty &nbsp;</div> <div class="qtu">1</div><div   
class="font" style="float:left">&nbsp;&nbsp;Add to basket</div>&nbsp;<img 
src="images/add-cart.jpg" /> </div>
</div>
<div class="product">
<img src="images/product2.jpg" align="" />
<div class="produ_name"><strong>Triumph Red/Yellow</strong>
from <span style="color:#60b62a"><strong>$5.99</strong></span><br />
<span style="color:#519371">in stock</span><br />
<div class="font" style="float:left">Qty &nbsp;</div> <div class="qtu">1</div><div     
class="font" style="float:left">&nbsp;&nbsp;Add to basket</div>&nbsp;<img 
src="images/add-cart.jpg" /> 
</div>
</div>
<div class="product">
<img src="images/product3.jpg" align="" />
<div class="produ_name"><strong>Triumph Red/Yellow</strong>
from <span style="color:#60b62a"><strong>$5.99</strong></span><br />
<span style="color:#519371">in stock</span><br />
<div class="font" style="float:left">Qty &nbsp;</div> <div class="qtu">1</div><div   
class="font" style="float:left">&nbsp;&nbsp;Add to basket</div>&nbsp;<img    
src="images/add-cart.jpg" /> </div>
</div>
<div class="product" style="margin:0px">
<img src="images/product4.jpg" align="" />
<div class="produ_name"><strong>Triumph Red/Yellow</strong>
from <span style="color:#60b62a"><strong>$5.99</strong></span><br />
<span style="color:#519371">in stock</span><br />
<div class="font" style="float:left">Qty &nbsp;</div> <div class="qtu">1</div><div   
class="font" style="float:left">&nbsp;&nbsp;Add to basket</div>&nbsp;<img 
src="images/add-cart.jpg" /> </div>
</div>
<div class="procuct_head" style=" padding:0px 0 10px 0; border-top:1px solid #98d075; 
margin-top:10px">Top Sellers:</div>
<div class="product">
<img src="images/product5.jpg" align="" />
<div class="produ_name"><strong>Triumph Red/Yellow</strong>
from <span style="color:#60b62a"><strong>$5.99</strong></span><br />
<span style="color:#519371">in stock</span><br />
<div class="font" style="float:left">Qty &nbsp;</div> <div class="qtu">1</div><div       
class="font" style="float:left">&nbsp;&nbsp;Add to basket</div>&nbsp;<img 
src="images/add-cart.jpg" /> </div>
</div>
<div class="product">
<img src="images/product6.jpg"  />
<div class="produ_name"><strong>Triumph Red/Yellow</strong>
from <span style="color:#60b62a"><strong>$5.99</strong></span><br />
<span style="color:#519371">in stock</span><br />
<div class="font" style="float:left">Qty &nbsp;</div> <div class="qtu">1</div><div       
class="font" style="float:left">&nbsp;&nbsp;Add to basket</div>&nbsp;<img   
src="images/add-cart.jpg" /> </div>

</div>
<div class="product">
<img src="images/product7.jpg" align="" />
<div class="produ_name"><strong>Triumph Red/Yellow</strong>
from <span style="color:#60b62a"><strong>$5.99</strong></span><br />
<span style="color:#519371">in stock</span><br />
<div class="font" style="float:left">Qty &nbsp;</div> <div class="qtu">1</div><div        
class="font" style="float:left">&nbsp;&nbsp;Add to basket</div>&nbsp;<img    
src="images/add-cart.jpg" /> </div>

</div>
<div class="product" style="margin:0px">
<img src="images/product8.jpg" align="" />
<div class="produ_name"><strong>Triumph Red/Yellow</strong>
from <span style="color:#60b62a"><strong>$5.99</strong></span><br />
<span style="color:#519371">in stock</span><br />
<div class="font" style="float:left">Qty &nbsp;</div> <div class="qtu">1</div><div     
class="font" style="float:left">&nbsp;&nbsp;Add to basket</div>&nbsp;<img    
src="images/add-cart.jpg" /> </div>
</div>
</div>
</div>
<div class="right_visit">
<div class="procuct_head" style="margin-left:0px; width:249px">Show products by:</div>
<div class="stelec_optio">Planting Month<select class="select" name="">    
<option>1</option><option>2</option></select></div>
<div class="stelec_optio">Flowering Month <select class="select" name="">   
<option>1</option><option>2</option></select></div>
<div class="stelec_optio">Flower Colour<select class="select" name="">  
<option>1</option>   
<option>2</option></select></div>
<div class="stelec_optio">Bulb Height<select class="select" name=""><option>1</option>  
<option>2</option></select></div>
<div class="visit_img"><img src="images/visit_img.jpg" alt="" /></div>
</div>
</div>
</div>
<div class="footer">
<div class="main_div">
csf f
</div>
</div>

</body>
</html>

所以这是我的html代码(带有一个附加的css和一些图像),现在我想为magento制作一个名为“FLOWER_BULB”的主题,我想知道这个开发的每一步以及如何选择这个主题我们制作的。我知道这是一个非常菜鸟的问题,但如果有人能像我的导师一样描述它,这对我很有帮助,在此先感谢。请帮助。

4

1 回答 1

1

你好,

要使用给定的主题,首先您必须了解 magento 的文件结构。我可以在这里给你一点知识。

  1. magento 中的 css 路径在/skin/frontend/default/default/css您可以在此处编辑现有 css 或创建新 css 文件。

  2. 可以包含在 css 中的图像的路径是/skin/frontend/default/default/images

  3. 要编辑 html,您必须使用路径/app/design/frontend/base/default/template/

  4. 要在头文件中包含 css 或 js,请使用/app/design/frontend/base/default/template/page/html/head.phtml

  5. 要知道文件的路径,您可以在系统->配置->开发者->调试或模板设置中使用开发者模式

如果您仍有任何疑问,请在此处评论..

于 2013-03-07T09:40:53.647 回答