การออกแบบเมนูในการติดต่อ ข้อมูลที่เป็นประโยชน์ในหัวข้อของกลุ่ม VKontakte วิธีเยื้อง

ฉันเพิ่งสับสนกับการออกแบบกลุ่ม VKontakte ของฉัน ฉันเห็นกลุ่มที่ออกแบบมาอย่างสวยงามมากมายและอยากทำอะไรที่คล้ายกัน หลังจากศึกษามาร์กอัป Wiki เป็นเวลาหลายชั่วโมง ในที่สุดฉันก็สร้างแบนเนอร์ที่สวยงามสำหรับตัวเองและ เมนูกราฟิกแบบเลื่อนลงนำไปสู่หน้าเว็บไซต์ของฉันโดยตรง สรุปว่ามันทำอย่างไร. ขั้นแรกสร้างรูปภาพสองภาพพร้อมกันใน Photoshop จากนั้นหนึ่งในนั้นจะถูกตัดออกเป็นหลายส่วน ถัดไปในหน้าแก้ไขของ VKontakte จะมีการแทรกรหัสพิเศษพร้อมลิงก์ภายนอก ทีนี้มาพูดถึงทุกอย่างตามลำดับ

ฉันสร้างกลุ่ม VKontakte
การออกแบบคุณภาพสูงของกลุ่ม VK และหน้าสาธารณะ เมนูที่ปักหมุด เมนูแบบเลื่อนลง เมนูกราฟิกภายใน แคตตาล็อก การนำทางภายใน - ราคาและ ผลงาน.

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

ขั้นตอนที่ 1
สร้างเอกสารใหม่ใน Photoshop ขนาดประมาณ 850x700 พิกเซล แล้วเติมสีขาว ในตัวอย่างนี้ ฉันซ้อนอินเทอร์เฟซ VKontakte ไว้ด้านบนทันทีเพื่อความชัดเจน ตอนนี้เราต้องตัดหน้าต่างสองบานในเลเยอร์เพื่อให้มองเห็นการออกแบบกราฟิกจริงได้ ขั้นแรก เลือกสี่เหลี่ยมผืนผ้าที่มีขนาด 200x500 พิกเซล แล้วกด Del จากนั้นเลือกสี่เหลี่ยมขนาด 510x309 แล้วกด Del

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

ขั้นตอนที่ 2
ตอนนี้เราวางการออกแบบกราฟิกทั้งหมดไว้ใต้เลเยอร์นี้ ในกรณีนี้ ฉันใส่รูปภาพที่มีพื้นหลังหลัก จากนั้นฉันก็เขียนข้อความ และจากนั้นก็อยู่ในสี่เหลี่ยมด้านซ้าย

ขั้นตอนที่ 3
ตอนนี้เราบันทึกสี่เหลี่ยมด้านขวา (อวตาร) ทันทีเป็นรูปภาพแยกต่างหากที่มีขนาด 200x500 พิกเซล นี่คือภาพสำเร็จรูปสำหรับการออกแบบกลุ่ม โหลดลงในบล็อกที่มุมขวาบนของกลุ่มซึ่งมีข้อความว่า "อัปเดตรูปภาพ" และภาพซ้ายต้องตัดเป็นหลายภาพตามจำนวนรายการเมนู ในกรณีนี้คือ 5 รูปภาพที่มีความกว้าง 510 พิกเซล

ขั้นตอนที่ 4
ในขั้นตอนนี้ เราจำเป็นต้องอัปโหลดรูปภาพ VKontakte ที่ตัดแล้วของเรา ในการดำเนินการนี้ ให้เลือกบล็อก "ข่าวล่าสุด" ใต้คำอธิบายกลุ่ม ฉันคิดว่านั่นคือสิ่งที่เรียกว่าในต้นฉบับ ฉันเปลี่ยนชื่อเป็น "เมนู" คลิก "แก้ไข" สำคัญ! ประการแรก คุณต้องมี Open Group ไม่ใช่เพจ เพราะไม่มีรายการดังกล่าวบนเพจ และประการที่สอง ในเมนูการจัดการชุมชน > ข้อมูล > วัสดุ ควรเลือกรายการ "เปิด"

ขั้นตอนที่ 5
ดังนั้นในแท็บ "การแก้ไข" เราคลิกที่ไอคอนกล้องและโหลดภาพเมนูตัดทั้งห้าภาพของเรา VKontakte จะอัปโหลดด้วยวิธีของตัวเอง โดยลดขนาดให้เหลือความกว้าง 400 พิกเซล และกำหนดแท็ก noborder ให้กับรูปภาพ ในขั้นตอนถัดไปเราต้องแก้ไขโค้ดเล็กน้อย

ขั้นตอนที่ 6
กล่าวคือ เราตั้งค่าขนาดรูปภาพต้นฉบับและเปลี่ยนแท็ก noborder เป็นแท็ก nopadding เรายังต้องใส่ URL ของลิงค์จากแต่ละรายการเมนูด้วย ในกรณีนี้ลิงก์แรกจะนำไปสู่หน้า VKontakte ภายในและลิงก์อีกสี่ลิงก์จะนำไปสู่หน้าเว็บไซต์ของฉันโดยตรง

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

[][][]

ขั้นตอนที่ 7
ฉันขอย้ำอีกครั้งเพื่อเปิดเมนูนี้คุณต้องคลิกที่จารึก "เมนู" และมันก็พับอยู่เสมอ อ่านความคิดเห็นในโพสต์ มีคำถามมากมายที่ตอบอยู่ที่นั่น เข้าร่วมกลุ่ม VKontakte ของฉัน

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

เมื่อสร้างกลุ่ม VKontakte คุณต้องทำสิ่งต่อไปนี้:

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

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

คำแนะนำในการสร้างเมนูสำหรับกลุ่ม VKontakte

ตั้งค่า

ขั้นแรก คุณจะต้องไปที่การตั้งค่ากลุ่มและเปิดใช้งานสื่อการสอน:

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

2. สนามใหม่ในกลุ่ม.

หลังจากตั้งค่าแล้ว ช่อง "ข่าวล่าสุด" ใหม่ควรปรากฏในกลุ่มของคุณ:

หากต้องการเปลี่ยนเนื้อหาของแบบฟอร์มนี้คุณจะต้องคลิกปุ่ม "แก้ไข" หลังจากนั้นแบบฟอร์มใหม่จะปรากฏขึ้นซึ่งคุณสามารถฝังไฟล์ต่าง ๆ รวมถึงเมนูสำหรับกลุ่ม:

ตอนนี้คุณต้องสร้างหรือดาวน์โหลดเมนูสำหรับกลุ่มของคุณ

3. การสร้างเมนูสำหรับกลุ่ม VKontakte

เพื่อนำเสนอตัวอย่างเราจะใช้โปรแกรม โฟโต้ชอป และสร้างเมนูใหม่ หลังจากเปิดตัวแก้ไขกราฟิกแล้ว ให้สร้างไฟล์ใหม่และกำหนดขนาดโดยประมาณเป็น 700 x 1,050 หลังจากนั้นให้เพิ่มภาพพื้นหลังและวาดปุ่มเมนูพร้อมคำจารึก:

4. การแบ่งภาพออกเป็นส่วนๆ

เพื่อที่จะตัดองค์ประกอบแต่ละส่วนของภาพ เราจำเป็นต้องมีเครื่องมือ "การตัด":

ใช้เครื่องมือนี้เพื่อเลือกพื้นที่รอบๆ แต่ละปุ่ม:

ตอนนี้ในเมนูเราเลือกการบันทึกพิเศษของเมนูที่สร้างขึ้น:

ในตัวอย่างนี้ เราแบ่งรูปภาพออกเป็น 5 ส่วน ตอนนี้เรามีรูปภาพ 5 รูปแยกกัน ซึ่งจะต้องรวมเป็นรูปภาพเดียว

5. ใส่รูปภาพ.

ตอนนี้เรากลับไปที่บรรณาธิการของช่อง "ข่าวล่าสุด" และเพิ่มรูปภาพที่นั่น:

เมื่อคุณเลือกไฟล์เมนูแล้ว คุณควรมีรหัสต่อไปนี้:

6. การตั้งค่ารหัส

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

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

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

อย่างที่คุณเห็นไม่มีอะไรซับซ้อนในการสร้างเมนูสำหรับกลุ่ม VKontakte ถ้าคุณไม่มี โฟโต้ชอป หรือคุณไม่รู้วิธีวาด (เช่นฉัน) จากนั้นดาวน์โหลดเมนูสำเร็จรูปบนอินเทอร์เน็ต ทางเลือกค่อนข้างกว้าง

การออกแบบเมนูกลุ่ม เคล็ดลับที่เป็นประโยชน์

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

หลังจากสร้างมาร์กอัป Wiki (โค้ดเมนู) แล้ว ให้บันทึกเป็นไฟล์ข้อความ หากมีสิ่งผิดปกติเกิดขึ้น คุณจะมีโอกาสกู้คืนเมนูได้
คุณสามารถค้นหาเทมเพลตเมนูกลุ่ม VKontakte บนอินเทอร์เน็ตได้อย่างง่ายดาย สิ่งนี้จะเป็นประโยชน์สำหรับทุกคนที่ไม่รู้วิธีทำงานกับ Photoshop และโปรแกรมแก้ไขกราฟิกอื่น ๆ
นอกจากนี้ เพื่อให้ทำงานได้ง่ายขึ้น คุณสามารถดาวน์โหลดปุ่มเมนูสำหรับกลุ่ม VKontakte บนอินเทอร์เน็ต และติดตั้งบนพื้นหลังใดก็ได้
อย่าถ่ายภาพเมนูเล็กเกินไป ในทางกลับกัน ควรใช้รูปแบบขนาดใหญ่มิฉะนั้นคุณภาพจะสูญหาย
ไม่ควรทำให้ความกว้างของเมนูเกิน 610 พิกเซล มิฉะนั้นอาจแสดงไม่ถูกต้องบนหน้า
มีบรรณาธิการพิเศษสำหรับการทำงานกับมาร์กอัป Wiki แต่คุณจะต้องเข้าใจแยกกัน พวกมันถูกสร้างขึ้นสำหรับมืออาชีพ
อย่ารีบเร่งที่จะทำงานให้เสร็จในโปรแกรมแก้ไขกราฟิก ลองใช้สี แบบอักษร พื้นหลัง และอื่นๆ
เมนูในกลุ่ม VK จะดูดีขึ้นหากรวมกับอวตาร ในการดำเนินการนี้ คุณจะต้องปรับขนาดของรูปภาพ

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

เมนูกลุ่มที่สวยงามราคา 100 รูเบิล

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

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

เครื่องมือแก้ไขจะเปิดขึ้น โดยตรงกลางจะมีปุ่ม "เลือกเทมเพลต" คลิกที่มันและเลือกเทมเพลตเมนู VKontakte สำเร็จรูปซึ่งมีตัวเลือกมากมาย:

หลังจากนั้นจะมีการเพิ่มรายการเมนู ทุกอย่างเป็นเรื่องง่ายที่นี่คุณระบุข้อความเมนูและในทางกลับกันให้เพิ่มลิงก์ที่ผู้ใช้จะถูกนำทางเมื่อคลิก:

ภายใต้การตั้งค่ารายการจะมีพารามิเตอร์เพิ่มเติม คุณสามารถเลือกพื้นหลังอื่น เปลี่ยนแบบอักษร สี ตำแหน่ง และอื่นๆ ได้:

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

ก่อนที่การดาวน์โหลดจะเริ่มขึ้น หน้าต่างจะเปิดขึ้นเพื่อเตือนลูกค้าว่าพวกเขาต้องจ่าย 100 รูเบิลสำหรับบริการนี้ รวมถึงการเพิ่มอัลบั้มการวางเมนูกราฟิกในกลุ่ม VKontakte และรหัส:

การชำระเงินบนเว็บไซต์นี้สามารถทำได้โดยใช้บัตรธนาคารหรือผ่าน PayPal ฝ่ายบริหารก็พร้อมที่จะรับเงินอิเล็กทรอนิกส์อื่น ๆ ผ่านระบบ Yandex.Cash ในราคาเพียง 100 รูเบิล คุณจะมีเมนูกลุ่ม VKontakte และการออกแบบใหม่จะช่วยในการพัฒนาเว็บไซต์อย่างแน่นอน

จะสั่งเมนูสำหรับกลุ่ม VKontakte ได้ที่ไหน?

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

มาร์กอัป Wiki และรูปถ่ายสำหรับการอัปโหลดไปยังอัลบั้มแยกต่างหาก

ข้อผิดพลาดเมื่อสร้างเมนูกลุ่ม VKontakte

ผู้ใช้ที่ไม่มีประสบการณ์มักพยายามประหยัดเงินและทำทุกอย่างด้วยตัวเอง หากไม่มีทักษะบางอย่าง (อย่างน้อยก็ความสามารถในการทำงานกับโปรแกรมแก้ไขกราฟิก) ผลลัพธ์ที่ได้ก็คืออะไรก็ได้ เมนูบางเมนูในกลุ่ม VK ทำให้เกิดเสียงหัวเราะและทั้งหมดเป็นเพราะความผิดพลาดเหล่านี้:

ข้อผิดพลาด 1

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

ข้อผิดพลาด 2

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

ข้อผิดพลาด 3

เพื่อให้ผู้เยี่ยมชมสนใจและบังคับให้เขาคลิกที่รายการเมนู VKontakte อย่างน้อยหนึ่งรายการ บางปุ่มจึงเพิ่มปุ่ม 10 ปุ่มขึ้นไป ไม่มีใครต้องการการนำทางเช่นนี้ ในทางกลับกัน มันทำให้ผู้ใช้สับสน ควรเลือกประเด็นหลัก 3-5 ประเด็นโดยไม่ต้องนำเสนอแคตตาล็อกจำนวนมาก

ข้อผิดพลาด 4

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

ข้อผิดพลาด 5

รายการเมนูควรมีความรอบคอบและมีประโยชน์ต่อผู้ใช้จริงๆ ตัวอย่างเช่น ในกลุ่มร้านค้าออนไลน์ การเพิ่มรายการการจัดส่ง แค็ตตาล็อก ผู้ติดต่อ เป็นเรื่องที่สมเหตุสมผล ในกลุ่มข้อมูล - กฎ, ราคาโฆษณา, ลิงก์ไปยังการสนทนา โปรดจำไว้ว่า แต่ละจุดควรทำให้ผู้เข้าชมเข้าใกล้การกระทำตามเป้าหมายมากขึ้น (คำสั่งซื้อ คำขอ ฯลฯ)

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

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

ขั้นตอนที่ 1
ขั้นแรก ไปที่กลุ่มของคุณและในบล็อก "ข่าวล่าสุด" (ในกรณีนี้ ฉันเปลี่ยนชื่อเป็น "เมนู") คลิกลิงก์ "แก้ไข" ซึ่งจะปรากฏขึ้นเมื่อคุณวางเมาส์เหนือมัน สำคัญ! ประการแรก คุณต้องมี Open Group ไม่ใช่เพจ เพราะไม่มีรายการดังกล่าวบนเพจ และประการที่สอง ในเมนูการจัดการชุมชน > ข้อมูล > วัสดุ ควรเลือกรายการ "เปิด"

ขั้นตอนที่ 2
ในแท็บ "การแก้ไข" ให้เขียนวลี [[ทฤษฎีการออกแบบเว็บ]] ไว้ในวงเล็บเหลี่ยมคู่ จากนั้นคลิกที่ปุ่ม “บันทึกหน้า”

ขั้นตอนที่ 3
หลังจากนั้นลิงก์ "ดูตัวอย่าง" จะปรากฏขึ้นข้างปุ่ม คลิกที่มัน ตัวอย่างเมนูของเราจะเปิดขึ้นด้านล่าง ซึ่งเราจะเห็นลิงก์ “ทฤษฎีการออกแบบเว็บ” ปรากฏด้านล่าง

ขั้นตอนที่ 4
คลิกที่ลิงค์นี้และไปที่หน้าที่สร้างขึ้นชื่อ "ทฤษฎีการออกแบบเว็บ" จากนั้นคลิกที่ลิงค์ "เติมเนื้อหา" ต่อไป เราจะแก้ไขข้อความเช่นเดียวกับในโปรแกรมแก้ไขข้อความทั่วไป - แทรกรูปภาพ ข้อความ วิดีโอ และวัตถุอื่น ๆ ในกรณีนี้ เพจที่เราสร้างขึ้นจะมี URL เช่น https://vk.com/page-15865937_43819846

ทางเลือกอื่นในการสร้างเพจภายใน
มีวิธีอื่นในการสร้างเพจ ส่วนใหญ่จะเหมาะสำหรับหน้าสาธารณะ (หน้าสาธารณะ) เนื่องจากวิธีการที่อธิบายไว้ข้างต้นไม่เหมาะสำหรับพวกเขา ในการทำเช่นนี้เราจะใช้รหัสต่อไปนี้
http://vk.com/pages?oid=-XXX&p=Page_Name
โดยที่แทนที่จะเป็น XXX เราจะแทนที่รหัสของกลุ่มของเราและเราจะเขียนเมนูแทนข้อความ "ชื่อเพจ" ตอนนี้เราต้องค้นหารหัสกลุ่ม วิธีการทำเช่นนี้? ไปที่หน้าหลักของกลุ่มและดูโพสต์ของเราบนกำแพง - ใต้บล็อก "เพิ่มโพสต์" จะมีข้อความ "โพสต์ทั้งหมด" - คลิกที่ลิงก์นี้

เราไปที่หน้านั้นแล้วเห็น URL แบบนี้ https://vk.com/wall-78320145?own=1โดยที่ตัวเลข 78320145 ในตัวอย่างนี้คือรหัสกลุ่ม เราแทนที่ข้อมูลของเราลงในซอร์สโค้ดและได้รับบันทึกดังนี้: http://vk.com/pages?oid=-78320145&p=Menu(พร้อมหมายเลขของคุณ!) วางบรรทัดนี้ลงในแถบที่อยู่ของเบราว์เซอร์แล้วกด Enter ดังนั้นเราจึงสร้างหน้า VKontakte ใหม่

บทความนี้จะเป็นคู่มือโดยละเอียดและฉันจะบอกวิธีสร้างเมนูสำหรับกลุ่ม VKontakte เมนูที่ออกแบบมาอย่างสวยงามของกลุ่ม VK ช่วยเพิ่มจำนวนผู้เข้าชมและการเติบโตของยอดขายบนเว็บไซต์อย่างแท้จริง

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

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

วันนี้มีเมนูที่สร้างขึ้นหลายประเภท:

เปิดด้วยรายการที่ใช้งานอยู่
ปิดเป็นโพสต์ปักหมุด;
ด้วยรูปภาพเดี่ยวหรือรูปภาพทั่วไปที่อยู่ติดกันของแบนเนอร์และเมนู

สาระสำคัญของการสร้างทั้งสองตัวเลือกจะเหมือนกัน ข้อแตกต่างหลักเพียงอย่างเดียวคือองค์ประกอบเพิ่มเติมและประเภทเรกคอร์ด และจะมีการกล่าวถึงในรายละเอียดเพิ่มเติมในบทความนี้

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

เมนูปิดกลุ่ม VK

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

เมนูจะมีลักษณะดังนี้:

เปิดเมนูกลุ่ม (สื่อที่ปักหมุดไว้)

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

วิธีสร้างเมนูที่สวยงามสำหรับกลุ่ม VKontakte: คำแนะนำทีละขั้นตอน

ก่อนอื่นเราจะต้องสร้างอวตารหลักของกลุ่มซึ่งเราจะวางไว้ทางด้านขวาและต้นขั้วสำหรับเมนูของเราในรูปแบบของแบนเนอร์

สำหรับอวตาร 200x332 พิกเซล
สำหรับแบนเนอร์เมนูหลัก 395x282 พิกเซล

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

เพื่อให้ชัดเจนหากความสูงของอวตารหลักของกลุ่มคือ 332 เราจะลบ 50 ออกจากนั้นและรับความสูงของเมนูหลักเท่ากับ 282 หากขนาดไม่สำคัญก็สามารถตั้งค่าความสูงได้โดยพลการ .

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

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

มาสร้างผืนผ้าใบใหม่ใน Photoshop ด้วยขนาด 600x350 พิกเซล ซึ่งเราจะใช้เป็นลายฉลุโดยตัดช่องต่างๆ ในรูปภาพของเราออก ในการทำงาน เราจำเป็นต้องแปลงขนาดขององค์ประกอบและไม้บรรทัดทั้งหมดเป็นพิกเซล และดำเนินการตามเส้นทางต่อไปนี้: “แก้ไข-การติดตั้ง-หลัก” และที่นี่เราตั้งค่าพิกเซล

ขั้นตอนต่อไปในการสร้างเมนูแบบเปิดคือสร้างภาพตัดสำหรับแบนเนอร์และอวตาร ซึ่งเราจะได้รับสำหรับการดาวน์โหลด โดยไปที่ส่วนของเมนูแนวตั้งด้านซ้ายแล้วเลือกการตัด

ใช้ปุ่มซ้ายของเมาส์ เหมือนกับว่าคุณกำลังเลือกพื้นที่ คุณจะต้องเลือกบล็อกขนาดที่เราต้องการ และหลังจากเลือกแต่ละครั้ง ให้กดปุ่ม "ลบ" และเลือก สีเทา 50%- การกระทำดังกล่าวจะทำให้บล็อกมีขนาดที่ต้องการและเน้นด้วยสีที่แตกต่างจากพื้นหลังหลัก

มันควรมีลักษณะเช่นนี้:

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

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

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

กลับไปที่ Photoshop และสร้างผืนผ้าใบใหม่ที่มีขนาด 400x300 พิกเซล จากนั้นเลือกในส่วน: file-place และเลือกรูปภาพสำหรับพื้นหลังเมนู

เราวางปุ่มของเมนูในอนาคตไว้บนรูปภาพและตัดรูปภาพตามที่เราทำด้านบนโดยเลือกบล็อกที่จำเป็น หลังจากนั้นเราก็เลือก "บันทึกสำหรับเว็บ" และรับโฟลเดอร์ที่มีการตัดของเรา ในกรณีของฉัน ฉันได้รูปภาพ 4 รูปในโฟลเดอร์แยกต่างหาก

ตอนนี้เราต้องอัปโหลดรูปภาพที่ดาวน์โหลดจาก Photoshop ไปยังอัลบั้มแยกต่างหากและซ่อนรูปภาพเหล่านั้นจากการสอดรู้สอดเห็น หลังจากโหลดแล้ว แต่ละภาพจะได้รับชื่อใหม่และรหัสเฉพาะของตัวเอง

โปรดทราบว่าคุณต้องมี:

วัสดุถูกเปิดในโหมด "จำกัด"
รวมการสนทนา;
โฟลเดอร์ที่มีรูปถ่ายเปิดสำหรับทุกคน

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

ต่อไปเราต้องแทรกรูปภาพที่เราได้รับเมื่อตัดใน Photoshop บางคนใช้โค้ดมาร์กอัป แต่เพื่อไม่ให้คิดมาก ฉันขอแนะนำให้คุณเลือกแทรกรูปภาพโดยคลิกที่ไอคอนกล้องแล้วอัปโหลดทีละภาพ

ทำงานในโปรแกรมแก้ไขข้อความหากหลังจากโหลดรูปภาพแล้วเราคลิกที่ไอคอนในรูปวงเล็บมุมบนขวาเราควรเห็นโค้ดนี้:

คำแนะนำ:จุดสำคัญหลังจากโหลดภาพคือการลบช่องว่างภายในออก ซึ่งสามารถแก้ไขได้โดยการใส่ "nopadding" ก่อนขนาดภาพ

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

[]
โดยที่ xxxxx คือรหัสของรูปภาพของคุณ
ปปปป - ความกว้างเป็นพิกเซล (สูงสุด 388)

มันควรจะมีลักษณะเช่นนี้:

ตอนนี้รูปภาพของเราถูกรวบรวมไว้ในแบนเนอร์แยกต่างหาก และหากต้องการเพิ่มลิงก์ไปยังแต่ละรายการ เพียงคลิกที่รูปภาพที่ปิดใช้งานมาร์กอัป และวาง URL ที่คัดลอกไว้ในส่วนลิงก์

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

http://vk.com/page-116682062_51411604?act=edit&hid=183950676§ion=edit

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

ไปที่หน้าหลักและทำสิ่งต่อไปนี้:

ขั้นตอนที่ #1

เราวางที่อยู่ของหน้าลงในช่องข้อความสำหรับโพสต์ใหม่บนผนัง หลังจากนั้นจะถูกแปลงเป็นลิงก์

ขั้นตอนที่ #2

เราแนบรูปภาพของตัวยึดตำแหน่งเมนูของเราไปกับโพสต์แล้วคลิกส่ง

ขั้นตอนที่ #3

หลังจากเผยแพร่โพสต์แล้ว ให้คลิกเวลาสร้างที่ด้านซ้ายล่างของโพสต์แล้วเลือก “PIN”

ยอดเยี่ยม!!! มาจบที่นี่กัน ตอนนี้คุณรู้วิธีสร้างเมนูเด็ดแล้วและคุณสามารถสร้างรายได้ที่ดีจากมันได้ ฉันแนะนำให้คุณทำทุกอย่างตามลำดับต่อไปนี้:

เราคิดโครงสร้างและสั่งการออกแบบรูปภาพเมนู
เราปรับขนาดและตัดภาพทั้งหมด
แทรกรูปภาพลงในอัลบั้ม
เราแก้ไขการตัดทั้งหมดในตัวแก้ไขและเผยแพร่บนหน้าหลักของกลุ่ม

ผลงานเราจึงได้เมนูนี้มา

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

สำคัญ: หลังจากเปลี่ยนการออกแบบ VK ในปี 2559 มีการเปลี่ยนแปลงใหม่เมื่อสร้างรูปภาพและข้อกำหนดสำหรับรูปภาพที่เกี่ยวข้อง

ดาวน์โหลดเทมเพลตเมนูกลุ่ม VK + แหล่งบทเรียนทั้งหมด

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

ฉันกำลังแนบวิดีโอเพื่อเสริมสิ่งที่คุณอ่าน -)))

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

พูดน้อย มาเริ่มสร้างกันดีกว่า เมนูสำหรับกลุ่มบน VKontakte.
ขั้นแรก คุณต้องสร้างกลุ่มขึ้นมาก่อน ตามที่ฉันได้เขียนไว้ในบทความที่แล้ว

ทุกอย่างเริ่มต้นใน Photoshop เราสร้างรูปภาพของเมนูที่คุณต้องการ โดยพื้นฐานแล้วนี่คือพื้นหลังบางประเภทพร้อมชื่อส่วนหัว คนรู้จักเพิ่งขอให้ฉันจัดกลุ่มสวยๆ ให้กับบริษัท aero-stomadent ของบริษัท ซึ่งเกี่ยวข้องกับการระบายอากาศทางอุตสาหกรรม ดังนั้นฉันจะจัดให้

ฉันพบพื้นหลังที่สวยงามของธรรมชาติของอลาสก้า และจริงๆ แล้ว ฉันจะทำทุกอย่างบนนั้น

เราเขียนเมนูเองในพื้นหลัง ตัวอย่างเช่น ฉันเขียนเกี่ยวกับสิ่งที่บริษัททำ ปุ่มเหล่านี้จะเป็นปุ่มที่ฉันจะสร้างหน้าเพิ่มเติมในภายหลัง แต่ละคำจะเป็นปุ่มเมนูในอนาคต

ทางด้านขวาให้ส่วนนี้เป็นอวตารของกลุ่มในอนาคต

ตอนนี้มีโหมดรูปภาพเป็นรูปภาพขนาดเล็ก เลือกฟังก์ชัน "การตัด" จากเมนู จากนั้นคลิกขวาบนผืนผ้าใบแล้วตัดเพื่อให้แต่ละคำแยกจากกัน

แนะนำให้ตัดประมาณนี้

หลังจากตัดแล้ว เราจะบันทึกไฟล์ ไม่เพียงแต่ผ่าน "บันทึกสำหรับเว็บและอุปกรณ์..." (หรือ Alt+Shift+Ctrl+S) โดยจะสร้างโฟลเดอร์ที่มีไฟล์ที่ตัดแล้วทั้งหมด

ตอนนี้เรายังไม่ถึงกลุ่ม แต่เรายังต้องสร้างมาร์กอัปวิกิ หรืออีกนัยหนึ่งคือสร้างเพจ

จะสร้างหน้า Wiki บน VKontakte ได้อย่างไร?

เปิดแท็บเบราว์เซอร์ใหม่และวางลิงก์ต่อไปนี้ที่นั่น: http://vk.com/pages?oid=-XXX&p=ชื่อของเพจ โดยที่ XXX คือ ID กลุ่มของคุณ ตัวอย่างเช่นสิ่งนี้เกิดขึ้นกับฉัน
http://vk.com/pages?oid=-91934542&p=menu

จากนั้นคลิก เติมเนื้อหา- ที่นี่เราเห็นโปรแกรมแก้ไขง่ายๆ เลือกฟังก์ชั่นกล้องเพื่อเพิ่มรูปภาพทั้งหมดของเราลงในเมนู มันควรจะกลายเป็นสิ่งที่คล้ายกับของฉัน

แต่มีช่องว่างระหว่างรูปภาพเพื่อลบช่องว่าง - เราเข้าสู่โหมดมาร์กอัป wiki (นี่คือเครื่องหมายคำพูดที่มุมขวาบน<>) ป้อนแท็กต่อไปนี้ "option;nopadding;" ก่อนขนาดภาพถ่าย ตัวอย่างเช่น []

และทุกอย่างก็มารวมกัน

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