[WP] เซียน wordpress ช่วยทำ dropdown menu ทีมนี้หน่อยคับ จ้าง 100 บาท

[น้องบิ้ว]

Theme ตัวนี้ ต้องโทษคนพัฒนาครับ ตกไปได้ไง

เข้าไปดูใน Directory ต่างๆใน Theme นั้นครับ เข้าไปตามลำดับดังนี้

EarthlyTouch --> js --> wp_jquery_dropdownmenu -->wp_jquery_dropdownmenu.php เปิดไฟล์ขึ้นมาเลยครับ ใช้ Editor ตัวไหนก็ได้

ช่วงบรรทัดที่ 41 มั้ง (Editplus)

โค้ด เลือก ขยาย

print "<script type='text/javascript' src='".get_bloginfo('url')."/wp-content/themes/Simplism/js/wp_jquery_dropdownmenu/jquery.js'></script>";

ตรง Simplism ให้เปลี่ยนชื่อเป็นชื่อ Theme ที่เราใช้ปัจจุบัน ซึ่งมันก็ชื่อ EarthlyTouch และแก้ตรงจุดอื่นๆด้วยครับ ใช้ Search and Replace เลย ง่ายดี

ส่วน Simplism นั้นมันคือชื่อ Theme ตัวหนึ่งครับ ของค่ายนี้เหมือนกัน และที่ Demo มันแสดงได้ ก็เพราะเค้าติดตั้ง Theme ตัวนี้ไว้ด้วยครับ

ง่ายสุด ไปโหลดปลั๊กอินมาจากเว็บต้นฉบับดีกว่า จะได้ไม่ต้องแก้ แล้วจะอธิบายทำไมเนี่ย

http://weeatbricks.com/2008/01/07/new-wordpress-plugin-for-creating-a-drop-down-navigation-menu-using-jquery/

ลองดูครับ ถ้าไม่ได้จะมาช่วยต่อ

ดีคับพี่ ขอบคุณมากคับพี่

ตรงนั้นผมเคยแก้แล้วคับ แต่ก็ยังไม่ได้อยู่ดีคับคับ TT ผมแก้ที่นี่คับ

Plugin > Wordpress JQuery Dropdown Menu  เลือก edit แล้วก็แก้เลยคับ
ขนาดผมยังแก้ให้เป็นตัวอักษรตัวเล็ก earthlytouch , ใน floder ก็แก้ให้เล็ก ก็ยังไม่ได้ พี่ลองเช็คได้คับ

ในส่วนของ head.php ไม่รู้ว่ามันลืมใส่อะไรหรือปล่าว TT

โค้ด เลือก ขยาย


<!--Begin Pages Navigation-->
<div id="pages">
<img src="<?php bloginfo('stylesheet_directory'); ?>/images/navigation-left.gif" style="float: left;" alt="nav-left" />
<ul>
<li class="page_item"><a href="<?php bloginfo('url'); ?>">Home</a></li>
<?php wp_list_pages('depth=1&title_li='); ?>

</ul>
<img src="<?php bloginfo('stylesheet_directory'); ?>/images/navigation-right.gif" style="float: right;" alt="cat-right" />
</div>
<!--End Pages Navigation-->

ส่วนในเว็บหลัก http://weeatbricks.com/2008/01/07/new-wordpress-plugin-for-creating-a-drop-down-navigation-menu-using-jquery/
มันบอกให้ใส่ <?php
echo wp_jquery_dropdownmenu(2, "Blog",1, 0);
?>   ผมก็ใส่นะคับ แต่มันออกมาแปลกๆ เหมือนมี menu 2 อันโผล่ออกมา พีลองดูสิคับ

ทำไงต่อดีอะคับ

[g-ji]

กรรม

stylesheet_directory มันก็คืนค่าออกมาเป็น

style.css ของธีมนั้นๆ สิ  

ถ้าจะเรียกไฟล์ในธีมนั้นๆ ออกมาให้ใช้

get_bloginfo('template_directory')."/ชื่อไฟล์หรือ โฟลเดอร์อื่นๆ/ชื่อไฟล์ที่ต้องใช้

แล้วก็
stylesheet_directory << มัน deprecate ไปแล้วมั้ง  

คิดไปเองป่าวหว่า ทำไม โค้ดมันดู โบราณๆ ไงไม่รู้ 

jQuery 1.1.4

กรรม

[น้องบิ้ว]

โค้ด เลือก ขยาย

print "<script type='text/javascript' src='".get_bloginfo('template_directory')."/js/wp_jquery_dropdownmenu/jquery.js'></script>";

แก้เป็นอันนี้เลย   มันจะคืนค่าเป็น url ธีม

ส่วนของป้อมนี่  ไม่รู้ว่ามันเป็นอะไร เหมือนมันโดนจำกัดอะไรไว้สักอย่าง ทำให้เข้าไม่ได้

ทำไมได้อะคับ ลองแล้ว ขอบคุณมากคับ  

[น้องบิ้ว]

กรรม

stylesheet_directory มันก็คืนค่าออกมาเป็น

style.css ของธีมนั้นๆ สิ  

ถ้าจะเรียกไฟล์ในธีมนั้นๆ ออกมาให้ใช้

get_bloginfo('template_directory')."/ชื่อไฟล์หรือ โฟลเดอร์อื่นๆ/ชื่อไฟล์ที่ต้องใช้

แล้วก็
stylesheet_directory << มัน deprecate ไปแล้วมั้ง  

คิดไปเองป่าวหว่า ทำไม โค้ดมันดู โบราณๆ ไงไม่รู้ 

jQuery 1.1.4

กรรม

ไม่เข้าใจอ่าา

หรือว่า style ของตัว dropdown มันไม่รัน
styles.css อยู่ floder นี้นะคับ
theme\earthlytouch\js\wp_jquery_dropdownmenu\styles.css

[g-ji]

เปิดใช้งาน wp_dropdown_menu แล้วใช่ป่าวอ่ะ  

หน้าเว็บมันมีโค้ดที่ไม่แสดงผลอยู่ ช่วงนึง

โค้ด เลือก ขยาย


print '<script type="text/javascript">'.
'$(document).ready(function() {'.
'$("#nav ul").removeClass("nj");'.
'$("#nav ul li").hover('.
'function () {'.
'}},'.
'function () {'.
'$(this).find(".dropdown_menu").queue(function () {'.
'$(this).animate({ '.
'opacity: 1'.
 '}, 500 );'.
'$(this).dequeue();'.
 '});'.
 '$(this).find(".dropdown_menu").queue(function () {'.
'$(this).fadeOut("fast");'.
'$(this).dequeue();'.
 '});'.
'});'.
'});'.



'</script>';
*/
/*
print '<script type="text/javascript">'.
'$("#nav ul").removeClass("nj");'.
'$(document).ready(function() {'.
'$("#nav ul li").hover('.
'function () {'.
'$(this).addClass("hovering");'.
'if ( $(this).hasClass("hovering") ){'.
'var dropdown_width = $(this).width();'.
'var paddingright = $(this).css("padding-right");'.
'var paddingleft = $(this).css("padding-left");'.
'$(this).find(".dropdown_menu").css("min-width",dropdown_width);'.
'$(this).find(".dropdown_menu").queue("fx",[]);'.
'$(this).find(".dropdown_menu").slideDown("fast");'.
';}},'.
'function () {'.
'$(this).find(".dropdown_menu").queue(function () {'.
'$(this).animate({'.
'opacity: 1'.
 '}, 500 );'.
'$(this).dequeue();'.
 '});'.
 '$(this).find(".dropdown_menu").queue(function () {'.
'$(this).fadeOut("fast")'.
'$(this).dequeue();'.
 '});'.
'$(this).removeClass("hovering");'.
'});'.
'});'.
'</script>';


โค้ดข้างบนนี้จะต้องแสดงผล อยู่ใต้

โค้ด เลือก ขยาย


print "<script type='text/javascript' src='".get_bloginfo('url')."/wp-content/themes/Simplism/js/wp_jquery_dropdownmenu/wp_jquery_dropdownmenu.js'></script>";


เอาง่ายๆ คือมันเป็นคำสั่งjava ที่ทำให้เกิด dropdown

ถ้าอิงตามโค้ดหน้าเว็บ

/*<script type='text/javascript' src='http://www.tvcooo.com/wp-content/themes/earthlytouch/js/wp_jquery_dropdownmenu/jquery.js'></script>*/

<link media='screen' type='text/css' href='http://www.tvcooo.com/wp-content/themes/earthlytouch/js/wp_jquery_dropdownmenu/styles.css' rel='stylesheet'></link>

/*<script type='text/javascript' src='http://www.tvcooo.com/wp-content/themes/earthlytouch/js/wp_jquery_dropdownmenu/wp_jquery_dropdownmenu.js'></script>

/*มันต้องอยู่ตรงนี้*/

<link rel="alternate" type="application/rss xml" title="Lannaarch &raquo; หน้าแรก Comments Feed" href="http://www.tvcooo.com/feed/" />

ถึงจะเกิด action dropdown menu

แล้วก็ ตัว html ของ เมนูจะต้องประกอบไปด้วย

<div="nav">
<ul>
<li></li>
</ul>
</div>

(พวกนี้เอามาจาก ตัว ปลั๊กอิน wp_jquery_dropdownmenu ทั้งหมดเลย)

แต่เท่าที่เห็นคือ มันไม่ print ส่วนที่ควบคุม เมนูจริงๆ ออกมา 

เดี๋ยวคงต้องเอาไปลองอีกเครื่อง (ว่างละ มะกี้แม่เล่นอยู่)

[น้องบิ้ว]

เปิดใช้งาน wp_dropdown_menu แล้วใช่ป่าวอ่ะ  

หน้าเว็บมันมีโค้ดที่ไม่แสดงผลอยู่ ช่วงนึง

โค้ด เลือก ขยาย


print '<script type="text/javascript">'.
'$(document).ready(function() {'.
'$("#nav ul").removeClass("nj");'.
'$("#nav ul li").hover('.
'function () {'.
'}},'.
'function () {'.
'$(this).find(".dropdown_menu").queue(function () {'.
'$(this).animate({ '.
'opacity: 1'.
 '}, 500 );'.
'$(this).dequeue();'.
 '});'.
 '$(this).find(".dropdown_menu").queue(function () {'.
'$(this).fadeOut("fast");'.
'$(this).dequeue();'.
 '});'.
'});'.
'});'.



'</script>';
*/
/*
print '<script type="text/javascript">'.
'$("#nav ul").removeClass("nj");'.
'$(document).ready(function() {'.
'$("#nav ul li").hover('.
'function () {'.
'$(this).addClass("hovering");'.
'if ( $(this).hasClass("hovering") ){'.
'var dropdown_width = $(this).width();'.
'var paddingright = $(this).css("padding-right");'.
'var paddingleft = $(this).css("padding-left");'.
'$(this).find(".dropdown_menu").css("min-width",dropdown_width);'.
'$(this).find(".dropdown_menu").queue("fx",[]);'.
'$(this).find(".dropdown_menu").slideDown("fast");'.
';}},'.
'function () {'.
'$(this).find(".dropdown_menu").queue(function () {'.
'$(this).animate({'.
'opacity: 1'.
 '}, 500 );'.
'$(this).dequeue();'.
 '});'.
 '$(this).find(".dropdown_menu").queue(function () {'.
'$(this).fadeOut("fast")'.
'$(this).dequeue();'.
 '});'.
'$(this).removeClass("hovering");'.
'});'.
'});'.
'</script>';


โค้ดข้างบนนี้จะต้องแสดงผล อยู่ใต้

โค้ด เลือก ขยาย


print "<script type='text/javascript' src='".get_bloginfo('url')."/wp-content/themes/Simplism/js/wp_jquery_dropdownmenu/wp_jquery_dropdownmenu.js'></script>";


เอาง่ายๆ คือมันเป็นคำสั่งjava ที่ทำให้เกิด dropdown

ถ้าอิงตามโค้ดหน้าเว็บ

/*<script type='text/javascript' src='http://www.tvcooo.com/wp-content/themes/earthlytouch/js/wp_jquery_dropdownmenu/jquery.js'></script>*/

<link media='screen' type='text/css' href='http://www.tvcooo.com/wp-content/themes/earthlytouch/js/wp_jquery_dropdownmenu/styles.css' rel='stylesheet'></link>

/*<script type='text/javascript' src='http://www.tvcooo.com/wp-content/themes/earthlytouch/js/wp_jquery_dropdownmenu/wp_jquery_dropdownmenu.js'></script>

/*มันต้องอยู่ตรงนี้*/

<link rel="alternate" type="application/rss xml" title="Lannaarch &raquo; หน้าแรก Comments Feed" href="http://www.tvcooo.com/feed/" />

ถึงจะเกิด action dropdown menu

แล้วก็ ตัว html ของ เมนูจะต้องประกอบไปด้วย

<div="nav">
<ul>
<li></li>
</ul>
</div>

(พวกนี้เอามาจาก ตัว ปลั๊กอิน wp_jquery_dropdownmenu ทั้งหมดเลย)

แต่เท่าที่เห็นคือ มันไม่ print ส่วนที่ควบคุม เมนูจริงๆ ออกมา 

เดี๋ยวคงต้องเอาไปลองอีกเครื่อง (ว่างละ มะกี้แม่เล่นอยู่)

เปิดใช้งานแล้วคับบ TT  เมื่อวานผมส่ง use pass ไปที่ pm คุณ g-ji นะคับ ได้รับไหมคับ ไม่รู้ขอมากไปป่าวหากสะดวกลองเข้าไปดูได้ไหมคับ ส่วนตัว งม โค๊ดไม่ค่อยเก่ง TT

[g-ji]

ออได้นะ แต่พอดี ยุ่งๆ clean การ์ตูนเรื่องใหม่อยู่ (พึ่งเสร็จเมื่อตอน 2 ทุ่มกว่าๆ นี่เอง)



โหลดธีมมาละเดี๋ยวลองในเครื่องก่อน

[น้องบิ้ว]

ออได้นะ แต่พอดี ยุ่งๆ clean การ์ตูนเรื่องใหม่อยู่ (พึ่งเสร็จเมื่อตอน 2 ทุ่มกว่าๆ นี่เอง)



โหลดธีมมาละเดี๋ยวลองในเครื่องก่อน

ดีใจคับ ขอบคุณมากเลยคับพี่

[Normaderm]

ผมติดใจ ลายเซ็น จขกท. อ้ะ 

ไม่เคยทำได้แบบนี้ มาก่อน!!
$25,000 (850,000 บาท)  

มันได้จริง หรอ 

[g-ji]

ตอนนี้แก้ไขได้ละ

รวมทั้งแก้บัก นิดหน่อยด้วย

ตัวไฟล์ธีมที่โหลดมานี่ มันสำหรับ WP เวอร์ชัน เก่าเลยอ่ะ ของใหม่หน้าเว็บทำมารองรับ 2.8 แล้ว เปลี่ยนโค้ดเยอะพอสมควร

ดังนั้นเลยต้องตามแก้ไขบางจุดให้ใกล้เคียงกับต้นฉบับมากที่สุด

จุดที่แก้ไข
1. เมนู ทั้งเพจเมนู และ category เมนู

เพจเมนู


cate เมนู


แก้ไขบัก ไฟล์

comment.php >> เหมือนตัวธีมปัจจุบัน

โค้ด เลือก ขยาย

http://www.elegantthemes.com/preview/EarthlyTouch/

home.php
index.php
single.php

สิ่งที่ตัดทิ้ง
ฟังก์ชัน gravatar >> WP 2.6 + มันดึง gravatar จาก email ได้อยู่แล้วดังนั้น ตัดทิ้งออกไปเลย  
ฟังก์ชันเมนูเดิม + ปลั๊กอิน ตัดทิ้งหมด ใช้ของใหม่เหมือน ธีมตัวอย่าง...(อย่าถามว่าจี้แก้ยังไง - - ไม่บอกแน่นอน กรรม ธีมนี้ต้องเสียเงินด้วยหรอเนี้ย - -* เหอๆ ... ธีมแบบนี้ยังต้องเสียเงินเพื่อโหลดอีกหรอเนี้ย เฮ้อ กลุ้ม...)

ขอเวลาเคลียร์ ไฟล์ 5 นาที เดี๋ยวจะอัพโหลดให้ใหม่

*****
ทดสอบธีม บน 2.9 rare


คิดว่าใช้ได้ทั้ง 2.7~2.7.x, 2.8 ~ 2.8.x เลยนะ

[Horde]

ดีใจด้วย ได้เซียนมาช่วยไว้ทันเวลา 555 สมกับเป็นคุณจี้ จริงๆ

[g-ji]

โค้ด เลือก ขยาย

http://www.mediafire.com/file/qimgnwjmrdx/EarthlyTouch.zip

ไฟล์ เฉพาะตัวธีมนะ

ปลั๊กอิน limit_post ยังต้องใช้อยู่ แต่แก้ให้มันไม่แสดงผลถ้าไม่ได้ติดตั้งปลั๊กอิน
(ปิดมันด้วย if(function_exists('...')) ถ้าไม่ได้ เปิดใช้ปลั๊กอินมันจะแสดงผล เนื้อหาปกติ แนะนำให้ไปหา excerpt_reload มาใช้ สุดยอดมาก )

ไปแปลตูนต่อละ   คืนนี้จะอัพเรื่องใหม่อีก หุหุ (จะแปลไหวมั้ยนี่ 4 เรื่องเข้าไปแล้ว  )

ปล. ธีมอันนี้ คล้ายกับธีมตัวอย่างนู้น ประมาณ 90% โค้ดบางจุดไม่ได้แก้ แต่ CSS, java script เป็นของใหม่เหมือนกับธีมตัวอย่างทั้งหมด

[น้องบิ้ว]

โค้ด เลือก ขยาย

http://www.mediafire.com/file/qimgnwjmrdx/EarthlyTouch.zip

ไฟล์ เฉพาะตัวธีมนะ

ปลั๊กอิน limit_post ยังต้องใช้อยู่ แต่แก้ให้มันไม่แสดงผลถ้าไม่ได้ติดตั้งปลั๊กอิน
(ปิดมันด้วย if(function_exists('...')) ถ้าไม่ได้ เปิดใช้ปลั๊กอินมันจะแสดงผล เนื้อหาปกติ แนะนำให้ไปหา excerpt_reload มาใช้ สุดยอดมาก )

ไปแปลตูนต่อละ   คืนนี้จะอัพเรื่องใหม่อีก หุหุ (จะแปลไหวมั้ยนี่ 4 เรื่องเข้าไปแล้ว  )

ปล. ธีมอันนี้ คล้ายกับธีมตัวอย่างนู้น ประมาณ 90% โค้ดบางจุดไม่ได้แก้ แต่ CSS, java script เป็นของใหม่เหมือนกับธีมตัวอย่างทั้งหมด

คุณจี้คร๊าปป น้ำตาำไหลพลาก ขอบคุณสุดๆเรยคับ http://www.tvcooo.com/  มันโผล่ขึ้นมาแล้วครับ  
เก่งจังเลยครับ  pm หมายเลขบันชีมาหน่อยคับ  เด๋วผมโอนค่าแก้ bug ให้คับ  

ขอบคุณพี่เดย์ที่ใ้หความรู้
ขอบคุณเพื่อนๆที่มาแชร์นะคับ
ขอบคุณคุณ g-ji ด้วยคับสุดๆเรยคับ
 ได้ทำงานต่อแล้วเรา

[Horde]

ขอนอกเรื่อง แต่ ไม่มากได้ปะครับ

คือ มีคำถามถามคุณจี้ ว่า dropdown มันจะไม่อยู่ข้างบนตลอด ถ้าไปโผล่ไปซ้อนกับ flash หรือ adsense เอง ก็ด้วยครับ

แบบนี้ มีวิธีแก้ปะครับ พอดีเข้าไปดูเว็บคุณ จี้ แล้ว เห็น ปัญหาคล้ายๆ ที่เจอ มา ตอนนี้ผมเลย เอา flash ออกจากเว็บหมดเลย


ขออนุญาตถามในกระทู้นี้ละกันนะครับ พอดีเป็นเรื่อง Dropdown menu

[g-ji]

↑ ทักมาเลยนึกได้

ยังไม่ได้อัพ CSS แก้ไข ปัญหานี้เลย

พึ่งอัพไปเมื่อกี้

เข้าไปดูให้หน่อยสิว่ามันยัง โดนทับอยู่มั้ย (ในเครื่องจี้มันไม่ทับกันแล้ว)

[daydies]

อ่อ สงสัยแก้ได้ล่ะ ว่าจะเข้ามาบอก ว่าธีมมันเก่าไป

ใน Demo มันใช้ jquery 1.3.2 เวอร์ชั่นปัจจุบัน แต่ในธีมที่โหลดมา มันเวอร์ชั่น 1.1.4 มั้ง

และมีการใช้ Superfish (jQuery menu plugin) น่าจะเอาไว้ทำเมนูดังกล่าวด้วย

ยังไงได้มือดีแก้ให้แล้ว ก็ดีใจด้วยครับ

[น้องบิ้ว]

พี่ g-ji ครับ  ในรูปพี่ส่วน Cagtarog มันมี dropdown menu อะคับ
ของผมไม่มีอะคับ

http://www.tvcooo.com/category/lannalanna-architecture-center/

แสดงแต่ข้างบน แต่ข้างล่างมันไม่แสดงอ่า  ต้องไปแก้ตรงไหนหรอคับ  

เมนู dropdown สีส้มๆนะคับ



 

[g-ji]

เมื่อคืนมันก็แสดงผลอยู่ไม่ใช่หรอ 

อืม...

มันต้องสร้าง category ลูกใน category หลักด้วยอ่ะ

อย่างเช่น ศูนย์สถาปัตยกรรมล้านนา ถ้าอยากให้มันแสดงผล dropdown ก็ต้องสร้าง category ย่อยๆ ไว้ข้างในอีก

มันถึงจะแสดงผลนะ

[น้องบิ้ว]

เมื่อคืนมันก็แสดงผลอยู่ไม่ใช่หรอ 

อืม...

มันต้องสร้าง category ลูกใน category หลักด้วยอ่ะ

อย่างเช่น ศูนย์สถาปัตยกรรมล้านนา ถ้าอยากให้มันแสดงผล dropdown ก็ต้องสร้าง category ย่อยๆ ไว้ข้างในอีก

มันถึงจะแสดงผลนะ

ได้แล้วคับพี่ จี้ ขอบคุณมากๆคับผม