ไฟล์บริบท

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

  1. ภาพรวม
  2. องค์ประกอบ LookAndFeel
  3. แอตทริบิวต์ขององค์ประกอบ LookAndFeel
  4. องค์ประกอบย่อยของ LookAndFeel
  5. การเพิ่มโลโก้ลงในหน้าผลลัพธ์ที่ฝากกับ Google

ภาพรวม

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

คุณใช้องค์ประกอบ Programmable Search เพื่อฝัง Programmable Search Engine ไว้ในหน้าเว็บและแอปพลิเคชันอื่นๆ โดยใช้ JavaScript เพื่อการแสดงเครื่องมือค้นหาที่ยืดหยุ่นยิ่งขึ้น

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

ก่อนที่จะเริ่มออกแบบรูปลักษณ์ของ Programmable Search Engine โปรดอ่านหลักเกณฑ์ในการติดตั้งใช้งาน Programmable Search Engine เอกสารนี้เป็นเอกสารสั้นๆ ที่บอกคุณว่าคุณควรจัดการกับการสร้างแบรนด์และการระบุแหล่งที่มาของ Google อย่างไร

กลับไปด้านบน

องค์ประกอบ LookAndFeel

ในไฟล์บริบท ข้อกำหนดเฉพาะด้านรูปลักษณ์ทั้งหมดจะกำหนดโดยองค์ประกอบ LookAndFeel ภายใต้ CustomSearchEngine องค์ประกอบนี้กำหนดว่าจะแสดงโฆษณาหรือไม่ แสดงผลส่วนผลการค้นหาอย่างไร และวิธีแสดงผลการค้นหาแต่ละรายการ ตัวอย่างต่อไปนี้แสดงแอตทริบิวต์และองค์ประกอบย่อยทั้งหมดขององค์ประกอบ LookAndFeel

<CustomSearchEngine ... >
  <Title>...</Title>
  <Description>...</Description>
  <Context>
     ...
  </Context>
  <LookAndFeel googlebranding="watermark"
      element_layout="1" theme="1" custom_theme="false" text_font="Arial, sans-serif"/>
    <Logo />
    <Colors url="#3366cc"
            background="#FFFFFF"
            border="#336699"
            title="#0000CC"
            text="#000000"
            visited="#ffbd10"
            title_hover="#0000CC"
            title_active="#0000CC"/>
    <Promotions title_color="#006600"
                title_visited_color="#663399"
                url_color="#3366ff"
                background_color="#FFFFFF"
                border_color="#ffff33"
                show_image="true"
                show_snippet="true"
                snippet_color="#330000"
                title_hover_color="#0000CC"
                title_active_color="#0000CC" />
    <SearchControls input_border_color="#BCCDF0"
                    button_border_color="#666666"
                    button_background_color="#CECECE"
                    tab_border_color="#E9E9E9"
                    tab_background_color="#E9E9E9"
                    tab_selected_border_color="#FF9900"
                    tab_selected_background_color="#FFFFFF" />
    <Results border_color="#FFFFFF"
             border_hover_color="#FFFFFF"
             background_color="#FFFFFF"
             background_hover_color="#FFFFFF" />
  </LookAndFeel>
  <AdSense />
  <EnterpriseAccount />
</CustomSearchEngine>

แอตทริบิวต์และองค์ประกอบ LookAndFeel บางรายการไม่เกี่ยวข้องกับเครื่องมือค้นหาบางประเภท เช่น แอตทริบิวต์ googlebranding จะใช้สำหรับเครื่องมือค้นหาที่โฮสต์โดย Google เท่านั้น และจะไม่มีผลหากเครื่องมือค้นหาของคุณใช้ตัวเลือกการโฮสต์ "องค์ประกอบการค้นหา"

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

ส่วนถัดไปจะอธิบายเกี่ยวกับเรื่องต่อไปนี้

กลับไปด้านบน

แอตทริบิวต์ขององค์ประกอบ LookAndFeel

แอตทริบิวต์ LookAndFeel ทั้งหมดเป็นค่าที่ไม่บังคับ หากคุณไม่ได้ระบุแอตทริบิวต์ Programmable Search Engine จะใช้ค่าเริ่มต้น ตัวอย่างเช่น หากคุณไม่กำหนดแอตทริบิวต์ element_layout ขององค์ประกอบ LookAndFeel Programmable Search Engine จะตีความว่าค่า element_layout คือ "1" แอตทริบิวต์บางอย่างอาจไม่ได้เกี่ยวข้องกับเครื่องมือค้นหาบางประเภท

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

ต่อไปนี้เป็นตัวอย่างองค์ประกอบ LookAndFeel ที่มีแอตทริบิวต์ที่กำหนดอย่างครบถ้วน

<LookAndFeel googlebranding="watermark"
             element_layout="1"
             theme="1"
             custom_theme="false"
             text_font="Arial, sans-serif" />

ตารางต่อไปนี้แสดงแอตทริบิวต์ของ CustomSearchEngine และค่าของแอตทริบิวต์

หมายเหตุ: กำหนดค่าของแอตทริบิวต์ที่เกี่ยวข้องกับตัวเลือกโฮสติ้งที่คุณเลือกเท่านั้น คอลัมน์ตัวเลือกโฮสติ้งจะแสดงตัวเลือกโฮสติ้งที่แอตทริบิวต์เหล่านี้จะมีผล

กลับไปด้านบน

แอตทริบิวต์ ตัวเลือกโฮสติ้ง คำอธิบาย ค่า
googlebranding ที่ฝากอยู่บน Google กำหนดช่องค้นหาสำหรับเครื่องมือค้นหาของคุณ

โปรดใช้ค่าใดค่าหนึ่งต่อไปนี้

  • watermark - ค่าเริ่มต้น

    ช่องค้นหาที่มีลายน้ำของ Programmable Search Engine

  • smnar

    ช่องค้นหาแคบๆ บนพื้นหลังสีขาว

  • smwide

    ช่องค้นหาแคบๆ บนพื้นหลังสีขาว

  • smwidg

    ช่องค้นหาแคบๆ บนพื้นหลังสีเทา

  • smnarg

    ช่องค้นหาแคบๆ บนพื้นหลังสีเทา

  • smnarb

    ช่องค้นหาที่มีพื้นที่กว้างบนพื้นหลังสีดำ

  • smwidb

    ช่องค้นหาแคบๆ บนพื้นหลังสีดำ

element_layout องค์ประกอบการค้นหา

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

โปรดใช้ค่าใดค่าหนึ่งต่อไปนี้

  • 1 - ค่าเริ่มต้น ความกว้างเต็มขนาด
  • 2 - กะทัดรัด
  • 3 - 2 คอลัมน์
  • 4 - 2 หน้า
  • 5 - โฮสต์โดย Google: เปิดในหน้าต่างปัจจุบัน
  • 6 - โฮสต์โดย Google: เปิดในหน้าต่างใหม่
  • 7 - ผลการค้นหาเท่านั้น
theme องค์ประกอบการค้นหา กำหนดรูปแบบของช่องค้นหาและผลการค้นหา

โปรดใช้ค่าใดค่าหนึ่งต่อไปนี้

  • 1 - ค่าเริ่มต้น คล้ายกับผลการค้นหาจาก Google

    รูปแบบที่เรียกว่าค่าเริ่มต้น

  • 2 - มินิมัลลิสต์มีชุดสีที่เรียบง่าย

    สไตล์ที่เรียกว่ามินิมัลลิสต์

  • 3 - ฟ้าเขียวใช้ Trebuchet เป็นแบบอักษร

    สไตล์ที่เรียกว่า Green Sky

  • 4 - Bubblegum ใช้ Arial เป็นแบบอักษร

    สไตล์ที่เรียกว่าบับเบิลกัม

  • 5 - Espresso ใช้แบบอักษร Georgia ซึ่งอยู่ในกลุ่ม serif ในชุดสีโทนร้อน

    สไตล์ที่เรียกว่า Espresso

  • 6 - Shiny ใช้แบบอักษร Verdana ซึ่งเป็นแบบอักษรในกลุ่ม sans-serif ในชุดสีโทนเย็น

    สไตล์ที่เรียกว่าแวววาว

custom_theme องค์ประกอบการค้นหา หากต้องการปรับแต่งธีมให้แสดงสีและชุดแบบอักษรที่แตกต่างจากมาตรฐาน ให้ตั้งค่าเป็น true มิฉะนั้น Programmable Search Engine จะไม่สนใจการปรับแต่งสีและแบบอักษรซึ่งกำหนดไว้ในองค์ประกอบย่อยของ LookAndFeel

ระบุอย่างใดอย่างหนึ่งต่อไปนี้

  • false - ค่าเริ่มต้น Google จะแสดงธีมมาตรฐาน
  • true - ตั้งค่า Programmable Search Engine ให้ยอมรับค่าที่กำหนดไว้ในองค์ประกอบย่อยของ LookAndFeel
text_font ทั้งหมด

ตั้งค่าชุดแบบอักษรสำหรับข้อความในผลการค้นหา

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

text_font="Arial, sans-serif"

หากคุณแสดงแบบอักษรมากกว่า 1 ชุด เบราว์เซอร์จะใช้แบบอักษรแรก หากเบราว์เซอร์ไม่รองรับแบบอักษรแรก ระบบจะลองใช้แบบอักษรถัดไป ดังนั้น ให้เริ่มด้วยแบบอักษรที่คุณต้องการ และลงท้ายด้วยชุดแบบอักษรทั่วไป เช่น Serif หรือ san-serif กลุ่มทั่วไปจะช่วยให้เบราว์เซอร์เลือกแบบอักษรที่คล้ายกันในกลุ่มทั่วไปได้เมื่อไม่มีแบบอักษรในรายการที่ใช้ได้

หากใช้ชุดแบบอักษรที่มีชื่อมากกว่า 1 คำ คุณต้องล้อมรอบด้วยคำในเครื่องหมายคำพูด (&quot;) ตัวอย่างเช่น Trebuchet MS ควรเขียนเป็น &quot;Trebuchet MS&quot;

องค์ประกอบย่อยของ LookAndFeel

องค์ประกอบย่อยทั้งหมดของ LookAndFeel เกี่ยวข้องกับองค์ประกอบ Search เท่านั้น ยกเว้นองค์ประกอบ Promotions แอตทริบิวต์ส่วนใหญ่ขององค์ประกอบ Promotions มีผลกับเครื่องมือค้นหาทุกประเภท โดยส่วนใหญ่แล้ว องค์ประกอบย่อยจะควบคุมสีของคอมโพเนนต์ต่างๆ ในเครื่องมือค้นหา ค่าสีคือค่าฐานสิบหก HTML มาตรฐาน หากคุณไม่ได้กำหนดแอตทริบิวต์ขององค์ประกอบ Programmable Search Engine จะใช้ค่าเริ่มต้น

หมายเหตุ: หากต้องการปรับแต่งองค์ประกอบการค้นหา คุณต้องตั้งค่าแอตทริบิวต์ custom_theme ขององค์ประกอบ LookAndFeel เป็น true ก่อนกำหนดค่าในองค์ประกอบย่อย หากคุณไม่ตั้งค่าแอตทริบิวต์ custom_theme เป็น true ค่าทั้งหมดที่คุณกำหนดไว้ในองค์ประกอบย่อย (ยกเว้น Promotions) จะละเว้นโดย Programmable Search Engine

LookAndFeel มีองค์ประกอบย่อยต่อไปนี้

  • Colors - กำหนดสีขององค์ประกอบการค้นหา
  • Promotions - กำหนดรูปลักษณ์ของโปรโมชัน การตั้งค่านี้จะมีผลกับเครื่องมือค้นหาทุกประเภท
  • SearchControls - กำหนดสีของคอมโพเนนต์ของช่องค้นหาองค์ประกอบการค้นหา
  • Results - กำหนดสีของคอมโพเนนต์ของส่วนผลการค้นหาองค์ประกอบของ Search

กลับไปด้านบน

องค์ประกอบย่อย Colors

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

ต่อไปนี้เป็นตัวอย่างองค์ประกอบ Colors ที่มีแอตทริบิวต์ที่กำหนดอย่างครบถ้วน

<Colors url="#3366cc"
        background="#FFFFFF"
        border="#336699"
        title="#0000CC"
        text="#000000"
        visited="#ffbd10"
        title_hover="#0000CC"
        title_active="#0000CC"/>

ตารางต่อไปนี้แสดงแอตทริบิวต์ที่ไม่บังคับของ Colors และค่า

แอตทริบิวต์ สีของคอมโพเนนต์
url URL ที่ด้านล่างของข้อมูลโค้ดผลการค้นหาแต่ละรายการ
background พื้นหลังของส่วนผลลัพธ์ทั้งหมด
border เส้นขอบรอบๆ องค์ประกอบของการค้นหา
title ชื่อของตัวอย่างผลการค้นหา ชื่อคือบรรทัดแรกของผลลัพธ์แต่ละรายการ
text ข้อความส่วนเนื้อหาของตัวอย่างข้อมูลผลลัพธ์
visited ลิงก์หลังจากที่ผู้ใช้คลิก
title_hover สีของชื่อเมื่อผู้ใช้วางเมาส์เหนือลิงก์
title_active สีของชื่อเมื่อผู้ใช้คลิกลิงก์

กลับไปด้านบน

องค์ประกอบย่อย Promotions

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

ต่อไปนี้เป็นตัวอย่างองค์ประกอบ Promotions ที่มีแอตทริบิวต์ที่กำหนดอย่างครบถ้วน

<Promotions title_color="#006600"
            title_visited_color="#663399"
            url_color="#3366ff"
            background_color="#FFFFFF"
            border_color="#ffff33"
            snippet_color="#330000"
            show_image="true"
            show_snippet="true"
            title_hover_color="#0000CC"
            title_active_color="#0000CC" />  

ตารางต่อไปนี้แสดงแอตทริบิวต์ที่ไม่บังคับของ Promotions และค่า

แอตทริบิวต์ สีของคอมโพเนนต์
title_color ชื่อของโปรโมชันแต่ละรายการ
title_visited_color ชื่อหลังจากที่ผู้ใช้คลิก
url_color URL ที่ด้านล่างของโปรโมชันแต่ละรายการ
background_color สีพื้นหลังของส่วนโปรโมชันทั้งหมด
border_color เส้นขอบรอบส่วนโปรโมชันทั้งหมด
snippet_color คำอธิบายของโปรโมชัน หากโปรโมชันไม่มีคำอธิบาย การตั้งค่าจะไม่เปลี่ยนแปลง
show_image

หากต้องการแสดงรูปภาพในโปรโมชัน ให้ตั้งค่าแอตทริบิวต์นี้เป็น true ค่าเริ่มต้นคือ false

รูปภาพที่จะแสดงได้รับการตั้งค่าไว้ในไฟล์โปรโมชัน

show_snippet

หากต้องการแสดงรายละเอียดในโปรโมชัน ให้ตั้งค่าแอตทริบิวต์นี้เป็น true ค่าเริ่มต้นคือ false

เนื้อหาของคำอธิบายมีระบุไว้ในไฟล์โปรโมชัน

title_hover_color ชื่อเมื่อผู้ใช้วางเมาส์เหนือลิงก์
title_active_color ชื่อเมื่อผู้ใช้คลิกลิงก์

กลับไปด้านบน

องค์ประกอบย่อย SearchControls

องค์ประกอบ SearchControls จะควบคุมสีของช่องค้นหาและแท็บสำหรับการปรับแต่งในองค์ประกอบของ Search หากคุณสร้างป้ายกำกับการปรับเกณฑ์การค้นหาไว้ในเครื่องมือค้นหาของคุณ ป้ายกำกับจะปรากฏเป็นแท็บในองค์ประกอบของการค้นหา หากคุณไม่มีป้ายกำกับการปรับแต่ง แท็บจะไม่ปรากฏ และ Programmable Search Engine จะไม่สนใจค่าของแอตทริบิวต์

หากต้องการให้ Programmable Search Engine เติมข้อความอัตโนมัติ โปรดดูส่วนที่อธิบายแอตทริบิวต์ autocompletions ขององค์ประกอบ CustomSearchEngine ในไฟล์บริบท

ต่อไปนี้เป็นตัวอย่างองค์ประกอบ SearchControls ที่มีแอตทริบิวต์ที่กำหนดอย่างครบถ้วน

<SearchControls input_border_color="#BCCDF0"
                button_border_color="#666666"
                button_background_color="#CECECE"
                tab_border_color="#E9E9E9"
                tab_background_color="#E9E9E9"
                tab_selected_border_color="#FF9900"
                tab_selected_background_color="#FFFFFF" />

ตารางต่อไปนี้แสดงแอตทริบิวต์ที่ไม่บังคับของ SearchControls และค่า

แอตทริบิวต์ สีของคอมโพเนนต์
input_border_color

เส้นขอบของช่องป้อนข้อมูลสำหรับคำค้นหา

button_border_color เส้นขอบรอบๆ ปุ่มค้นหา
button_background_color ปุ่มค้นหา
tab_border_color เส้นขอบรอบแท็บที่ไม่ได้โฟกัสในปัจจุบัน (ผู้ใช้ไม่ได้เลือก)
tab_background_color แท็บที่ไม่ได้อยู่ในโฟกัส
tab_selected_border_color แท็บที่ผู้ใช้เพิ่งเลือกไปโดยการคลิก แท็บที่ผู้ใช้คลิกล่าสุดจะได้รับสถานะที่เลือก
tab_selected_background_color สีของแท็บที่เลือกไว้ในปัจจุบัน

กลับไปด้านบน

องค์ประกอบย่อย Results

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

รูปที่ 1: ผลลัพธ์ที่มีการแจกแจงผลลัพธ์แต่ละรายการและผลลัพธ์แต่ละรายการที่มีการไฮไลต์ด้วยเมาส์โอเวอร์

ผลลัพธ์ที่มีผลลัพธ์ที่แจกแจงรายละเอียดแล้วผลลัพธ์ที่มีผลลัพธ์ที่มีการเน้นสูง

ผลลัพธ์จะมี 2 สถานะ ดังนี้

  • สถานะปกติ - ลักษณะที่ปรากฏของผลลัพธ์แต่ละรายการเมื่อเมาส์ไม่ได้อยู่เหนือผลลัพธ์นั้นๆ
  • สถานะวางเมาส์เหนือ - ลักษณะของผลลัพธ์แต่ละรายการเมื่อเคอร์เซอร์ของเมาส์วางเหนือผลลัพธ์นั้น

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

ต่อไปนี้เป็นตัวอย่างองค์ประกอบ Results ที่มีแอตทริบิวต์ที่กำหนดอย่างครบถ้วน

<Results border_color="#FFFFFF"
         border_hover_color="#FFFFFF"
         background_color="#FFFFFF"
         background_hover_color="#FFFFFF" />

ตารางต่อไปนี้แสดงแอตทริบิวต์ที่ไม่บังคับของ Results และค่า

แอตทริบิวต์ สีของคอมโพเนนต์
border_color เส้นขอบของผลลัพธ์แต่ละรายการในสถานะปกติ
border_hover_color ขอบของผลลัพธ์เมื่อเมาส์อยู่เหนือผลลัพธ์
background_color สีพื้นหลังของบุคคลจะทำให้มีสถานะปกติ
background_hover_color พื้นหลังของผลลัพธ์เมื่อเมาส์วางอยู่เหนือผลลัพธ์

กลับไปด้านบน

การเพิ่มโลโก้ลงในหน้าผลลัพธ์ที่ฝากกับ Google

หากให้ Google โฮสต์หน้าผลการค้นหาของคุณ คุณสามารถใส่โลโก้หรือรูปภาพขนาดเล็กไว้ถัดจากช่องค้นหาในหน้าผลการค้นหาได้ รูปภาพต้องเป็นไฟล์ .jpg, .png หรือ .gif ที่โฮสต์บนเว็บไซต์ (ถือว่าเป็นรูปของคุณเองหรือจากเว็บไซต์ที่ไม่มีข้อจำกัดด้านลิขสิทธิ์) คุณสามารถเชื่อมโยง URL กับรูปภาพ ซึ่งทำให้คลิกได้

หมายเหตุ: หากคุณใช้ Programmable Search Element เพื่อโฮสต์ผลการค้นหา คุณจะเพิ่มรูปภาพโดยใช้แผงควบคุมหรือไฟล์บริบทไม่ได้

ต่อไปนี้เป็นตัวอย่างของหน้าผลการค้นหาที่มีโลโก้

รูปที่ 3: ช่องค้นหาที่มีรูปภาพ

รูปภาพและ URL ของรูปภาพจะกำหนดในแอตทริบิวต์ขององค์ประกอบ Logo ภายใต้องค์ประกอบ LookAndFeel ตัวอย่างต่อไปนี้แสดงวิธีเพิ่มโลโก้ลงในหน้าผลลัพธ์ที่ฝากกับ Google

<LookAndFeel>
   <Logo url="http://www.ascii.com/logo.gif"
         destination="http://www.ascii.com/"
         height="90"/>
   ...
</LookAndFeel>

ตารางต่อไปนี้แสดงแอตทริบิวต์ขององค์ประกอบ Logo

แอตทริบิวต์ คำอธิบายและค่า
url URL ของรูปภาพ เป็นไฟล์ .gif, .png หรือ .jpg
destination หากต้องการให้รูปภาพเป็นลิงก์ ให้กำหนดปลายทาง URL
height ความสูงของรูปภาพเป็นพิกเซล ความสูงสูงสุดคือ 100 พิกเซล คุณไม่จำเป็นต้องระบุความกว้างเนื่องจาก Programmable Search Engine จะยังคงรักษาสัดส่วนภาพไว้ คุณไม่จำเป็นต้องระบุความสูง เว้นแต่ว่ารูปภาพจะมีขนาดใหญ่เกินไป และคุณต้องการให้ Programmable Search Engine ลดขนาดลง

กลับไปด้านบน