วิธีแก้ไขปัญหา Scroll To Anchor ของ Elementor บนมือถือ

Elementor เป็นปลั๊กอินสร้างเพจยอดนิยมสำหรับ WordPress ที่ช่วยให้ผู้ใช้สามารถสร้างเว็บไซต์ที่น่าทึ่งและโต้ตอบได้โดยไม่ต้องมีความรู้ด้านการเขียนโค้ด หนึ่งในคุณสมบัติมากมายคือความสามารถในการสร้างลิงก์จุดยึดที่เลื่อนไปยังส่วนเฉพาะบนหน้า อย่างไรก็ตาม ผู้ใช้บางรายได้รายงานปัญหาเกี่ยวกับลิงก์ Anchor เหล่านี้ทำงานไม่ถูกต้องบนอุปกรณ์เคลื่อนที่ ซึ่งอาจสร้างความหงุดหงิดให้กับทั้งเจ้าของเว็บไซต์และผู้เยี่ยมชม

หากคุณประสบปัญหานี้ ไม่ต้องกังวล! มีวิธีแก้ไขปัญหาหลายประการที่สามารถช่วยคุณแก้ไขปัญหาการเลื่อนไปยังจุดยึดของ Elementor ในมือถือได้ ในคู่มือนี้ เราจะสำรวจวิธีที่มีประสิทธิภาพสูงสุดในการแก้ไขปัญหานี้ รวมถึงการปรับการตั้งค่าเว็บไซต์ของคุณ การใช้โค้ดที่กำหนดเอง และการติดตั้งปลั๊กอิน ด้วยเคล็ดลับและคำแนะนำเหล่านี้ คุณจะมั่นใจได้ว่า Anchor Link ของเว็บไซต์ของคุณทำงานได้อย่างราบรื่นและราบรื่นในทุกอุปกรณ์ มอบประสบการณ์ผู้ใช้ที่ดีขึ้นสำหรับผู้เยี่ยมชมของคุณ

Anchor คืออะไรใน Elementor

เมนูข้ามเป็นอีกชื่อหนึ่งของเมนูจุดยึด รหัสจุดยึดนี้จะนำคุณไปยังสถานที่ที่คุณระบุเป็นค่ากำหนด เมนูจุดยึดช่วยให้ผู้ดูของคุณไปยังหน้าถัดไป คลิกที่ลิงก์ใดก็ได้ และทำการค้นหาใดๆ โดยทั่วไปแล้ว นี่คือผู้ดำเนินการเว็บไซต์ WordPress

การใช้ Anchor บนไซต์ของคุณสามารถช่วยคุณได้อย่างไร

สมอเรือสามารถใช้งานได้หลายวัตถุประสงค์ การเชื่อมโยงนี้จะช่วยเพิ่มประสิทธิภาพประสบการณ์การท่องเว็บบนเว็บไซต์ของคุณ ข้อดีมีดังนี้:

ปรับปรุงประสบการณ์ผู้ใช้

ลิงก์ Anchor อำนวยความสะดวกในการเรียกดู ผู้เยี่ยมชมของคุณเพียงแค่คลิก แตะ และเลือกบริการที่ต้องการรับ สิ่งนี้จะช่วยปรับปรุงประสบการณ์ออนไลน์

ช่วยให้คุณสามารถกลับไปยังด้านบนของเนื้อหา

หากคุณเลื่อนดูมากเกินไป Anchor Link อาจช่วยให้คุณไปที่ด้านบนของหน้าได้ เครื่องมือนี้จะช่วยคุณประหยัดเวลาและช่วยให้คุณดำเนินการได้ตามปกติ

รับประกันการท่องเว็บที่มีประสิทธิภาพ

นอกจากการเลื่อนแล้ว Anchor Link ยังใช้สำหรับคลิก กลับไปยังหน้าก่อนหน้า ฯลฯ ซึ่งอำนวยความสะดวกในการเรียกดูอย่างมีประสิทธิภาพ

ประสิทธิภาพที่รวดเร็วยิ่งขึ้น

คุณสามารถรับการตอบสนองได้ทันทีจากคำสั่ง แทนที่จะป้อนคำแนะนำ ลิงก์จุดยึดช่วยให้การนำทางเร็วขึ้น

เหตุใดคุณสมบัติ Scroll to Anchor ของ Elementor จึงใช้งานไม่ได้บนมือถือ

เป็นการยากที่จะอธิบายว่าทำไมการเลื่อนเพื่อยึดใน Elementor จึงไม่ทำงานบนมือถือ อย่างไรก็ตาม หลังจากการสอบสวนอย่างครอบคลุม เราก็สามารถระบุข้อเท็จจริงต่อไปนี้ได้:

เป้าหมายไม่เพียงพอ

หากเพจของคุณไม่มีลิงก์เป้าหมาย เช่น Sobre-Agencia, Como-Fazer, บริการ, ผู้ติดต่อ ฯลฯ นี่อาจเป็นปัจจัยที่ทำให้ลิงก์เลื่อนของคุณไม่สามารถทำงานได้

ส่วนขยายทำให้เกิดปัญหา

หากอุปกรณ์ Android ของคุณโหลดส่วนขยาย อาจบล็อกคุณสมบัติการเลื่อนไม่ให้ทำงานด้วย

มีปลั๊กอินมากเกินไป

หากเว็บไซต์ของคุณมีปลั๊กอินมากเกินไป นี่อาจเป็นอีกสาเหตุหนึ่งที่ทำให้จุดยึด WordPress ของคุณหยุดตอบสนอง ปลั๊กอินเพิ่มเติมขัดแย้งกัน นี่อาจทำให้เว็บไซต์ของคุณไม่สามารถเข้าถึงได้

สภาพเซิร์ฟเวอร์ไม่ดี

หากเซิร์ฟเวอร์เว็บไซต์ของคุณไม่สามารถจัดการปลั๊กอินได้ อาจเป็นสาเหตุที่ทำให้ลิงก์ของคุณไม่ทำงาน

5 เคล็ดลับที่มีประสิทธิภาพที่สุดในการแก้ไข Elementor Scroll toAnchor

แม้ว่าสาเหตุที่ Elementor scroll to Anchor ไม่ได้ผล แต่เคล็ดลับต่อไปนี้จะช่วยคุณในการซ่อมแซมเว็บไซต์ของคุณ เอาล่ะ;

การสร้างเป้าหมาย

ลิงก์เลื่อนของคุณอาจไม่ทำงานหากเพจของคุณไม่มีลิงก์เป้าหมาย ด้วยเหตุนี้ คุณต้องสร้างลิงก์เป้าหมายก่อน จากนั้นจึงเน้นลิงก์ในลักษณะต่อไปนี้:

ขั้นแรก เลือกธีมของคุณและป้อนรหัสต่อไปนี้ลงในชีตของคุณ

.menu-item a{
     Color: black;


}

หากคุณต้องการได้รับแจ้งว่าลิงก์ของคุณปรากฏต่อผู้ชมของคุณหรือไม่ ให้เลือกตัวเลือกนี้ โดยระบุ CSS ต่อไปนี้:

.menu-itema.mPS2id-highlight{
      color: red;
}

ใช้ตัวกรองจาวาสคริปต์

สำหรับวิดเจ็ตสมอ Elementor คุณสามารถใช้ตัวกรองจาวาสคริปต์ได้ รันโปรแกรมต่อไปนี้เพื่อเพิ่มตัวกรอง:

add_action( 'wp_footer', function() {
    if ( ! defined( 'ELEMENTOR_VERSION' ) ) {
        return;
    }
    ?>
    <script>
        jQuery( function( $ ) {
            $( window ).on( 'elementor/frontend/init', function() {

                elementorFrontend.hooks.addFilter( 'frontend/handlers/menu_anchor/scroll_top_distance', function( scrollTop ) {
                    var isMobile = $(window).width() <= 760;
                    if (isMobile) {
                        return scrollTop - 1000;
                    } else {
                        return scrollTop;
                    }   
                } ); 
            } );
        } );
    </script>
    <?php
} );

ปรับการเลื่อน

ปรับการเลื่อนออฟเซ็ตในขณะที่เมนูเปิดอยู่ในโหมดมือถือเป็นทางเลือกหนึ่ง

ป้องกันไม่ให้เมนูปิด

แม้ว่านี่จะไม่ใช่วิธีแก้ปัญหาที่ใช้งานได้ แต่ตัวเลือกเดียวคือเปิดเมนูแบบเลื่อนลงของแถบเมนูไว้ สิ่งนี้จะช่วยอำนวยความสะดวกในการนำทางหากจุดยึดการเลื่อนของคุณค้าง

เลือกธีมเริ่มต้น

สิ่งหนึ่งที่คุณอาจทำได้เพื่อแก้ไขไอคอนจุดยึดบนไซต์ของคุณคือแก้ไขไอคอน เลือกธีมเริ่มต้นสำหรับ WordPress นี่เหนือกว่า

วิธีเพิ่ม Anchor ให้กับเว็บไซต์ Elementor ของคุณอย่างง่ายดายโดยใช้ปลั๊กอิน

ปลั๊กอินเป็นวิธีที่สะดวกที่สุดในการเพิ่มลิงก์สมอไปยังเว็บไซต์ หากต้องการเพิ่มสมอ โปรดทำตามขั้นตอนด้านล่าง:

ติดตั้งปลั๊กอินเพิ่มลิงก์ก่อนที่จะเพิ่มลิงก์ใดๆ จากนั้น สร้างบล็อกรหัสย่อในตำแหน่งที่ลิงก์สมอควรปรากฏ ดำเนินการรหัสย่อต่อไปนี้:

[ps2id id='section-1'/]

แทรกลิงก์สมอลงในบล็อกรหัสย่อใหม่ล่าสุด วางไว้ทุกที่ที่คุณต้องการให้ลิงค์ปรากฏ ดำเนินการรหัสต่อไปนี้:

[ps2id url='#some-id']link text[/ps2id]

จากนั้นแทนที่ 'some-id' ด้วยชื่อจุดยึดที่สร้างขึ้นและข้อความลิงก์ด้วยจุดยึดที่ต้องการ บันทึกการเปลี่ยนแปลงทันที คุณทำเสร็จแล้ว

5 สุดยอดปลั๊กอิน Anchor และ Scroll

มีปลั๊กอินมากมายที่ปรับปรุงการเข้าถึงการเชื่อมต่อได้อย่างมาก หลังจากการตรวจสอบอย่างครอบคลุมแล้ว เราขอเสนอปลั๊กอิน Anchor ห้ารายการด้านล่างนี้ว่าดีที่สุด

ห่อ

เจ้าของเว็บไซต์ทุกคนต้องการเว็บไซต์ WordPress ที่ใช้งานได้เต็มรูปแบบ ผู้ใช้ของคุณอาจผิดหวังหากทำงานไม่ถูกต้อง การที่ Elementor ไม่สามารถเลื่อนไปยังจุดยึดบนมือถือได้เป็นปัญหาทั่วไปที่เจ้าของเว็บไซต์ทุกคนต้องเผชิญ เพื่อให้ชีวิตของคุณง่ายขึ้น เราได้เน้นการแฮ็กที่มีประสิทธิภาพที่สุด เราเชื่อว่าข้อมูลนี้จะช่วยคุณในการซ่อมแซมของคุณได้