Hoe kan ik de beelden wijzigen in de index.tpl
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<div class="big-img-foot rc3 clearfix">
<div class="c-banners g-marg g-border g-graund_6 g-shadow">
<h2>{translate('TEXT_FIRST_FRONTLINE')}<span class="g-blue_bg g-graund_6"></span> </h2>
<p>{translate('TEXT_SECOND_FRONTLINE')}</p>
<span class="b-banners_butt"> <a href="{$href.tshirtbuilder}"></a> </span>
</div>
</div>
<div class="c-banners g-marg g-border g-graund_6 g-shadow">
<h2>{translate('TEXT_FIRST_FRONTLINE')}<span class="g-blue_bg g-graund_6"></span> </h2>
<p>{translate('TEXT_SECOND_FRONTLINE')}</p>
<span class="b-banners_butt"> <a href="{$href.tshirtbuilder}"></a> </span>
</div>
</div>
Ik zou graag dit beeldje laten switchen door enkele andere beelden.
Ook de tekst zou dan moeten veranderen. Zou dit moeilijk zijn?
Ik zie nergens geen link naar de afbeelding, dus zal het iets met classes zijn of zo. (denk ik)
Beelden mogen ook gewoon naar beneden vallen en een ander in de plaats. (is gelijk voor mij)
Ik wil gewoon dat mensen zien dat er meer te beleven valt dan enkel textieldruk.
De site zal dan ook wat dynamischer lijken (zijn)
De volledige code van de .tpl file is het volgende:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
{strip}
<div class="c-search g-graund_6 g-shadow g-gradient g-border g-marg c-search_100">
<form id="search_form" name="search_form" action="{$href.search_form}" method="post">
<b>{translate('IMAGE_SEARCH')}: </b>
<input type="text" name="aFilter[keyword]" id="keyword" class="c-search_input g-border g-graund_6">
<a href="javascript:;" onclick="document.search_form.submit()" class="c-search_but g-border g-graund_6"></a>
</form>
</div>
<div class="c-width">
<div class="big-img-foot rc3 clearfix">
<div class="c-banners g-marg g-border g-graund_6 g-shadow">
<h2>{translate('TEXT_FIRST_FRONTLINE')}<span class="g-blue_bg g-graund_6"></span> </h2>
<p>{translate('TEXT_SECOND_FRONTLINE')}</p>
<span class="b-banners_butt"> <a href="{$href.tshirtbuilder}"></a> </span>
</div>
</div>
{if $newest_designs}
<h2>
{translate('TEXT_NEWEST_DESIGNS')}
</h2>
<table class="c-addcart g-marg">
{foreach $newest_designs as $design}
{if $design@index%3==0}
<tr>{/if}
<td valign="top">
<a href="/my_designs" class="c-craft_box g-border g-graund_6" style="
background:#fff url('');
margin-bottom: 10px;
text-align: center;
height: 194px;
line-height: 194px;
">
<img src="{$design.img}" alt="image of product #{$design.img}" style='max-height: 190px;max-width: 190px;vertical-align: middle;'/>
</a>
</td>
{if $design@index%3==2}</tr>{/if}
{/foreach}
</table>
<h2>
{translate('TEXT_MOST_SOLD_PRODUCTS')}
</h2>
{/if}
<table class="c-addcart g-marg">
{foreach $categories as $category}
{if $category@index%3==0}
<tr>{/if}
{$new_products[$category@key]}
{if $category@index%3==2}</tr>{/if}
{/foreach}
</table>
<div class="c-cct-shirt">
<div class="c-sp_top">
<h1>{translate('TEXT_CREATE_CUSTOM_TSHIRTS')}</h1>
<hr class="c-cct-top">
<table width="100%" class="c-cct-shirt_t">
<tr>
<td class="c-cct-shirt_t_title"><b>{translate('TEXT_TRENDS_DISCOUNTS')}</b></td>
<td class="c-cct-shirt_t_title" colspan="2"><b>{translate('TITLE_OUR_GUARANTEE')}</b></td>
</tr>
<tr>
<td class="c-cct-shirt_t_title_line">{translate('TEXT_SIGN_UP_FOR_NEWSLETTER')}</span></td>
<td class="c-cct-shirt_t_title_line"><span
class="c-cct-shirt_guar">{translate('TEXT_FAST_DELIVERY')}</span></td>
<td class="c-cct-shirt_t_title_line"><span
class="c-cct-shirt_guar">{translate('TEXT_HELPFUL_SERVICE')}</span></td>
</tr>
<tr>
<td class="c-cct-shirt_t_title_line">
<form action="inner.php?_page=create_account" method="post" name="email_form">
<input name="email" type="text" class="autoclear g-border c-cct-shirt_t_mail" value="{translate('TEXT_YOUR_EMAIL_ADDRESS')}" size="30">
<a href="javascript: document.email_form.submit()" class="g-butt_arrow g-gradient g-shadow g-border g-graund_6"><span></span></a>
</form>
</td>
<td class="c-cct-shirt_t_title_line"><span
class="c-cct-shirt_guar">{translate('TEXT_HIGH_QUALITY_PRINTING')}</span></td>
<td class="c-cct-shirt_t_title_line"><span
class="c-cct-shirt_guar">{translate('TEXT_FAIR_RETURN_POLICY')}</span></td>
</tr>
</table>
<hr class="c-cct-bott">
{$bottom_information_block_ccts}
</div>
</div>
</div>
{/strip}
<div class="c-search g-graund_6 g-shadow g-gradient g-border g-marg c-search_100">
<form id="search_form" name="search_form" action="{$href.search_form}" method="post">
<b>{translate('IMAGE_SEARCH')}: </b>
<input type="text" name="aFilter[keyword]" id="keyword" class="c-search_input g-border g-graund_6">
<a href="javascript:;" onclick="document.search_form.submit()" class="c-search_but g-border g-graund_6"></a>
</form>
</div>
<div class="c-width">
<div class="big-img-foot rc3 clearfix">
<div class="c-banners g-marg g-border g-graund_6 g-shadow">
<h2>{translate('TEXT_FIRST_FRONTLINE')}<span class="g-blue_bg g-graund_6"></span> </h2>
<p>{translate('TEXT_SECOND_FRONTLINE')}</p>
<span class="b-banners_butt"> <a href="{$href.tshirtbuilder}"></a> </span>
</div>
</div>
{if $newest_designs}
<h2>
{translate('TEXT_NEWEST_DESIGNS')}
</h2>
<table class="c-addcart g-marg">
{foreach $newest_designs as $design}
{if $design@index%3==0}
<tr>{/if}
<td valign="top">
<a href="/my_designs" class="c-craft_box g-border g-graund_6" style="
background:#fff url('');
margin-bottom: 10px;
text-align: center;
height: 194px;
line-height: 194px;
">
<img src="{$design.img}" alt="image of product #{$design.img}" style='max-height: 190px;max-width: 190px;vertical-align: middle;'/>
</a>
</td>
{if $design@index%3==2}</tr>{/if}
{/foreach}
</table>
<h2>
{translate('TEXT_MOST_SOLD_PRODUCTS')}
</h2>
{/if}
<table class="c-addcart g-marg">
{foreach $categories as $category}
{if $category@index%3==0}
<tr>{/if}
{$new_products[$category@key]}
{if $category@index%3==2}</tr>{/if}
{/foreach}
</table>
<div class="c-cct-shirt">
<div class="c-sp_top">
<h1>{translate('TEXT_CREATE_CUSTOM_TSHIRTS')}</h1>
<hr class="c-cct-top">
<table width="100%" class="c-cct-shirt_t">
<tr>
<td class="c-cct-shirt_t_title"><b>{translate('TEXT_TRENDS_DISCOUNTS')}</b></td>
<td class="c-cct-shirt_t_title" colspan="2"><b>{translate('TITLE_OUR_GUARANTEE')}</b></td>
</tr>
<tr>
<td class="c-cct-shirt_t_title_line">{translate('TEXT_SIGN_UP_FOR_NEWSLETTER')}</span></td>
<td class="c-cct-shirt_t_title_line"><span
class="c-cct-shirt_guar">{translate('TEXT_FAST_DELIVERY')}</span></td>
<td class="c-cct-shirt_t_title_line"><span
class="c-cct-shirt_guar">{translate('TEXT_HELPFUL_SERVICE')}</span></td>
</tr>
<tr>
<td class="c-cct-shirt_t_title_line">
<form action="inner.php?_page=create_account" method="post" name="email_form">
<input name="email" type="text" class="autoclear g-border c-cct-shirt_t_mail" value="{translate('TEXT_YOUR_EMAIL_ADDRESS')}" size="30">
<a href="javascript: document.email_form.submit()" class="g-butt_arrow g-gradient g-shadow g-border g-graund_6"><span></span></a>
</form>
</td>
<td class="c-cct-shirt_t_title_line"><span
class="c-cct-shirt_guar">{translate('TEXT_HIGH_QUALITY_PRINTING')}</span></td>
<td class="c-cct-shirt_t_title_line"><span
class="c-cct-shirt_guar">{translate('TEXT_FAIR_RETURN_POLICY')}</span></td>
</tr>
</table>
<hr class="c-cct-bott">
{$bottom_information_block_ccts}
</div>
</div>
</div>
{/strip}
P.S. wat is {strip} eigenlijk, kan het niet terugvinden op http://www.w3schools.com/
Gewijzigd op 23/02/2015 20:58:25 door Didier Van Canneyt
Verder is Cycle een goede jQuery-library om beelden of HTML-elementen af te wisselen.
Ik vind $('#fade').cycle(); wel leuk..
Moet ik dat gewoon erbijplaatsen...
Of misschien beter een plaats waar ik daarover kan bijleren.
Ik ken echt niets van webdesign..
Verder is de basis van jQuery bij te leren op W3Schools.
Als je al zegt dat het mogelijk is, dan moet het wel lukken.
Toevoeging op 24/02/2015 14:32:29:
Lukt aan geen kanten. lol
Ben weer met iets begonnen hoor.
Toevoeging op 24/02/2015 14:36:48:
Op http://www.busimatch.com gebruik ik een slide.
Zou ik dat ook kunnen gebruiken op dvcgraphics.com?
Mag ik gewoon wat daar in staat verwijderen, voor busimatch wist ik het wel.
Ik kreeg er uitleg bij.. zal het eens proberen..
Toevoeging op 24/02/2015 14:52:18:
WOehoe, het lukt +/- :-)
Toevoeging op 24/02/2015 14:54:38:
Enkel gebruikte ik <bx_text:_degusteer /> bij busimatch
Misschien eens die gewone code gebruiken die ik op de site zag overal...
