2013-03-07 5 views
-1

его первая попытка с дизайном магнитной темы. У меня есть шаблон HTML (включая CSS и изображения), который выглядит следующим образом:Разработка темы с magento

[я хочу, чтобы создать и выбрать 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», и я хочу знать каждый шаг этого развития, а также как выбрать эту тему, которую мы сделали. Я знаю, что это очень пустой вопрос, но мне было бы очень полезно, если кто-нибудь сможет описать его как наставник для меня, спасибо заранее. любезную помощь.

+0

Эта ссылка может помочь вам http://fishpig.co.uk/blog/create-a-custom-theme-in-magento.html – mumair

ответ

1

Здравствуйте pranshu,

Чтобы использовать данную тему в первую очередь вы должны понять структуру файлов Magento. Я могу дать вам немного знаний здесь.

  1. Путь CSS в Magento в /skin/frontend/default/default/css вы можете eithe редактировать существующие CSS или создать новый файл CSS здесь.

  2. Путь к изображениям, которые могут быть включены в КСС /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. Чтобы узнать путь к файлу, вы можете использовать режим разработчика в системы-> configration-> developer-> отладки или шаблон настройки

Если у вас есть какие-либо сомнения, комментарий здесь.

Смежные вопросы