สอบถามหน่อยนะครับ
- เพิ่ม Slide ในส่วนของ Home Edit
ตรงส่วนนี้สามารถเพิ่ม/ลดรูปหรือยกเลิกการใช้จากหลังบ้านได้ไหมครับหรือว่าต้องแก้ที่ code เลยครับ
ถ้าหากต้องแก้ที่ code ต้องเอา code ส่วนไหนออกครับ
ขอบคุณครับ
ส่วนนี้ต้องปรับแต่งเองก่อนครับ ยังไม่มีแบบปรับแต่งจากหลังร้าน ส่วนนี้อยู่ในตัวต่อไปที่จะแจกครับ
การปรับแต่งส่วนนี้อยู่ใน Module ที่ชื่อ editorial แก้ไขที่ไฟล์ editorial.tpl
<!-- Module Editorial -->
<link href="{$this_path}style.css" rel="stylesheet" type="text/css" media="all" />
<script type="text/javascript" src="{$this_path}jquery.cycle.js"></script>
{literal}
<script type="text/javascript">
$(document).ready(function(){
$("#banner-imgs").cycle({
fx: 'scrollHorz',
speed: '500',
next: '#arrow_right',
prev: '#arrow_left',
timeout: 8000
});
$('#subscribe_btn').click(function () { $('#subscribe_box').slideToggle('fast'); });
});
</script>
{/literal}
<div id="editorial_block_center" class="editorial_block">
<div id="banner" >
<div id="banner-imgs">
<a href="#" style="display: none;" ><img src="{$base_dir}modules/editorial/images/1.jpg" alt="" /></a>
<a href="#" style="display: none;" ><img src="{$base_dir}modules/editorial/images/2.jpg" alt="" /></a>
<a href="#" style="display: none;" ><img src="{$base_dir}modules/editorial/images/3.jpg" alt="" /></a>
</div><br /> {if $xml->body->$paragraph}<div class="rte">{$xml->body->$paragraph|stripslashes}</div>{/if}
<!--<div>
<img src="{$base_dir}modules/editorial/images/prev.png" alt="" id="arrow_left" />
<img src="{$base_dir}modules/editorial/images/next.png" alt="" id="arrow_right" />
</div> -->
</div>
</div>
รายละเอียดของตัวแปร(ไฮไลสีแดง)fx: 'scrollHorz', ทิศทางที่รูปสไลด์ไป ถ้าใส่ scrollHorz ทิศทางจะไปตามแนวนอน ถ้าใส่ scrollVert จะไปแนวตั้ง และยังมีแบบอื่นอีกมากเลยครับ ดูที่นี่ครับ hxxp://malsup.com/jquery/cycle/browser.html
speed: '500', ปรับความเร็วในการเลื่อนสไลด์
next: '#arrow_right', css ในส่วนของ next
prev: '#arrow_left', css ในส่วนของ prev
timeout: 8000 ระยะเวลาที่จะแสดงสไลด์ตัวต่อไป
หากต้องการรูปแบบที่แตกต่างขึ้นอีกดูหน้านี้ครับ hxxp://malsup.com/jquery/cycle/int.html
ดูข้อมูลเพิ่มเติมได้ที่นี่ครับ htxxp://malsup.com/jquery/cycle/
ไฮไลสีเขียวอยากจะเพิ่มรูปภาพเท่าไหร่ก็ใส่เข้าไปในส่วนี้เลยครับ ใส่รูปแบบตามนี้ครับ
<a href="#" style="display: none;" ><img src="{$base_dir}modules/editorial/images/[ชื่อรูปภาพ].jpg" alt="" /></a>
และนำรูปภาพที่จะใช้ไปใส่ในโฟลเดอร์ modules/editorial/images ขนาดรูปภาพ แนะนำที่ขนาด 570x250 ครับ ถ้าต้องการรูปที่แตกต่างจากขนาดนี้ ก็ต้องไปแก้ขนาดที่ modules/editorial/style.css ด้วยครับ
ไฮไลสีม่วงเป็นส่วนแสดงข้อความรายละเอียดที่เราพิมพ์เข้าไปที่ Home edit หลังร้านครับ
ไฮไลสีเทาส่วนนี้ผม comment ไว้เพื่อไม่ให้มันแสดงผลออกมา เป็นส่วนของไอคอน next กับ prev ครับ ใครจะเอา comment ออกก็ได้ครับ
พัฒนาเว็บไซต์
