איך מטמיעים את תו הTrust?

קוד להטמעת התו ■ איך מטמיעים את התו בE-SHOP ■ איך מטמיעים את התו ב-Wordpress - אפשרות 1: באמצעות תוסף (Plugin) ■ איך מטמיעים את התו ב-Wordpress - אפשרות 2: באמצעות Elementor ■ איך מטמיעים את התו בקונימבו ■ איך מטמיעים את התו ב-SHOPOFY ■ קוד להטמעת קרוסלת חוות דעת ■ ווידג'ט חוות דעת שקופץ לאחר חוסר פעילות ■ יצירת עמוד חוות דעת באתר שלכם

אם אתם כאן, כנראה שהחברה שלכם היא אחת מבין החברות המובחרות שעברו את תהליך הבדיקה הקפדני שלנו בהצלחה וקיבלו את תו מידרג Trust! ועכשיו - הגיע הזמן להראות לכווווולם את התו שהרווחתם ביושר.

אז איך עושים את זה?

קוד להטמעת התו

<!-- Midrag Trust Code -->
<script>
    function getCurrentDateTime() {
         var date = new Date();
         var day = date.toISOString().split('T')[0];
         var hours = date.getHours();
         return day + ' ' + hours;
    }

document.addEventListener('DOMContentLoaded', function() {
    var script = document.createElement('script');
    script.src = "https://trust.midrag.co.il/external/embededCompanyCard.v2.js?v=" + encodeURIComponent(getCurrentDateTime());

    script.setAttribute('data-guid', '👉INSERT YOUR GUID HERE👈');
    script.setAttribute('data-widget-type', 'side');
    script.setAttribute('data-display-header', '0');
    script.setAttribute('data-display-x-icon', 'true');
    script.setAttribute('data-create-icon', 'true');
    script.setAttribute('data-position', 'bottom-left');
    script.setAttribute('data-mobile-position', 'bottom-left');
    script.setAttribute('data-offset-x-mobile', '10');
    script.setAttribute('data-offset-y-mobile', '10');
    script.setAttribute('data-offset-x-desktop', '10');
    script.setAttribute('data-offset-y-desktop', '10');
    script.setAttribute('data-size', 'regular');
    script.setAttribute('data-mobile-size', 'small');
    script.setAttribute('data-color', 'white');

    document.body.appendChild(script);
});
</script>
<!-- End of Midrag Trust Code -->

זה הקוד הבסיסי. מעתיקים אותו, מכניסים כמה התאמות קטנות וזה הכל :)

התאמה אישית של התו

פרמטר חובה:

הפרמטר guid משייך את התו אליכם, ולכן הוא פרמטר חובה. אתם תקבלו אותו מאיתנו במייל, וכל מה שצריך לעשות זה להכניס אותו במקום הכיתוב הזה: 👉INSERT YOUR GUID HERE👈

פרמטרים עיצוביים:

הפרמטר data-position יקבע את מיקום התו בגרסת הדסקטופ של האתר שלכם. אפשר לבחור: 'bottom-left' ,'top-left', 'top-right' , 'bottom-right'. הפרמטר data-mobile-position מאפשר לשנות את מיקום התו בגרסת המובייל של האתר.
ניתן לבחור בין שלושה סוגי עיצוב באמצעות הפרמטר data-widget-type:
- Side: תו צמוד לקצה המסך. נצמד לצד שמאל או ימין בהתאם לפרמטר data-position. פרמטר data-offset-x לא רלוונטי לסוג זה כי התו צמוד לקצה המסך (ולכן לא ניתן לשנות את המיקום שלו בציר האופקי).
- Pentagon: תו בצורת מחומש. תומך בשני צבעים שניתן להגדיר באמצעות פרמטר data-color: לבן 'white' או שחור 'black'.
- Circle: תו עגול. הצבע קבוע ולא ניתן לשינוי עם פרמטר data-color (לא מושפע ממנו).
הפרמטרים data-size ו-data-mobile-size יקבעו את גודל התו באתר שלכם בתצוגת הדקסטופ ובתצוגת המובייל. אפשר לבחור: 'large' , 'small' , 'regular'. אם לא נגדיר גודל למובייל, הגודל יהיה כמו זה שנבחר לדסקטופ. אם לא נגדיר גודל לשניהם, ברירת מחדל היא regular.

אין מה לדאוג - הכל ניתן לשינוי בכל רגע נתון. אפשר לנסות פרמטר מסויים, לראות איך זה נראה באתר ואם לא אוהבים - לשנות.

איך מטמיעים את התו בE-SHOP

מתחברים לדאשבורד הניהול של אתר ה-e-shop שלכם.
בתפריט העליון, בוחרים ב"הגדרות", ואז בתפריט שנפתח לוחצים על SEO.
בעמוד ההגדרות שנפתח, לוחצים על הכפתור "e-shop Hybrid" מצד שמאל.
לוחצים על "הוסף קוד חדש" מימין.
בכותרת כותבים "מידרג". במיקום בוחרים "Body". בשדה "קוד" מדביקים את הקוד המותאם עם התו של החברה, ומשנים את הסטאטוס לפעיל.

איך מטמיעים את התו ב-Wordpress - אפשרות 1: באמצעות תוסף (Plugin)

על מנת להטמיע את התו באתר שלכם, יש להתקין בוורדפרס את התוסף "Midrag Trust Widget":

נכנסים לעמוד הניהול של אתר הוורדפרס שלכם.
בתפריט מצד ימין, בוחרים באפשרות "Plugins" > "Add Plugin".
בעמוד שנפתח, כותבים את שם התוסף "Midrag Trust Widget" בחיפוש. כשהוא מופיע לוחצים על Install Now, ואז על Activate.
לאחר שתתקינו את התו, ניתן לגשת להגדרות (Settings) ולבחור באפשרות "Midrag Trust Widget".
במסך שייפתח תתבקשו להזין את ה-GUID הייחודי שלכם (שתקבלו מאיתנו במייל).
שאר השדות במסך מאפשרות לשלוט בנראות התו (צורה, גודל, מיקום וכד').

איך מטמיעים את התו ב-Wordpress - אפשרות 2: באמצעות Elementor

נכנסים לעמוד הניהול של אתר הוורדפרס שלכם.
בתפריט מצד ימין, בוחרים באפשרות "אלמנטור" > "ניהול קודים".
בעמוד שנפתח, לוחצים על "קוד חדש" למעלה מצד ימין.
בשדה "הוספת כותרת" כותבים "מידרג", ובשדה "מיקום" בוחרים <body>.
בשדה הגדול מדביקים את הקוד של התו, ואז לוחצים על "פרסם" משמאל.

איך מטמיעים את התו בקונימבו

נכנסים לדאשבורד ניהול האתר שלכם בקונימבו.
בתפריט העליון בוחרים באפשרות "Hybrid" > "עריכת קוד".
בחלק העליון של העמוד שנפתח, בוחרים באפשרות "קובץ חדש".
בעמוד שנפתח ממלאים את הפרמטרים הבאים:
- בשדה "כותרת" כותבים "מידרג",
- בשדה "סוג הקוד" בוחרים "חנות",
- בשדה "פעיל בחנות" מסמנים "כן",
- בשדה "בחר דף להטמעה" בוחרים "כל החנות".
- בשאר השדות לא נוגעים.
את הקוד מדביקים בשדה body <html>
לסיום לוחצים על "שמור", ואז על "ניקוי קאש". ייתכן שיעברו מספר דקות עד שיהיה רענון לקאש והתו יופיע באתר.

איך מטמיעים את התו ב-SHOPOFY

נכנסים לעמוד הניהול של אתר ה-Shopify שלכם.
בתפריט מנווטים לאפשרות "Online Store", ולוחצים על האפשרות "Themes" שתחתיה.
בעמוד ה-Themes שלכם, משכפלים קודם את ה-Theme הפעיל (שמסומן בירוק עם הכותרת "Current Theme"). כדי לעשות זאת, לוחצים על 3 הנקודות שליד שם ה-Theme ובוחרים באפשרות "Duplicate" (שלב זה עשוי להימשך מספר דקות).
נווטו ל-Theme המשוכפל, לחצו על 3 הנקודות ובחרו באפשרות "Edit Code".
בעמוד שנפתח מנווטים לתפריט "EXPLORER" מצד שמאל. לוחצים על האפשרות "Layout", ומבין האפשרויות שנפתחות בוחרים ב-"theme.liquid".
לוחצים על המקשים Ctrl+F (או Cmd+F במאק) כדי להעלות את שורת החיפוש, ומחפשים את הביטוי </head>, על מנת למצוא את נקודת הסיום של ה-Header באתר שלכם.
יוצרים שורה רווח מעל ה-</head> (לוחצים Enter מעל הביטוי).
מדביקים את הקוד של מידרג מעל ה-</head>.
לוחצים על Save מצד ימין למעלה.

קוד להטמעת קרוסלת חוות דעת

<!-- Midrag Trust Carousel Code -->
<div>
    <div id="trust-swiper" style="min-height:300px;"></div>
    <script src="https://trust.midrag.co.il/external/swiperCompanyCard.v2.js"
            data-guid="👉INSERT YOUR GUID HERE👈"></script>
</div>
<!-- End of Midrag Trust Carousel Code -->

ווידג'ט חוות דעת שקופץ לאחר חוסר פעילות

ווידג'ט חוות דעת דינאמי שהוא למעשה אקטיבי. אם הלקוח לא מבצע כל פעילות באתר במשך X שניות - יקפוץ לו חלון קטן שבו מופיעה חוות דעת אחת שתתחלף באופן אוטומטי אחת לכמה שניות, עד שתבוצע פעילות נוספת על ידי הלקוח.

קוד להטמעת הווידג'ט:

<!-- Midrag Trust Reviews Widget for Inactivity -->
<script>
	function getCurrentDateTime() {
		var date = new Date();
		var day = date.toISOString().split('T')[0];
		var hours = date.getHours();
		return day + ' ' + hours;
	}
document.addEventListener('DOMContentLoaded', function() {
	var script = document.createElement('script');
	script.src = "https://trust.midrag.co.il/external/embededReviewsWidget.v1.js?v="
		+ encodeURIComponent(getCurrentDateTime());
	script.charset = 'UTF-8';
	script.setAttribute('data-guid', '👉INSERT YOUR GUID HERE👈');
	script.setAttribute('data-position', 'bottom-left');
	script.setAttribute('data-position-mobile', 'bottom-left');
	script.setAttribute('data-height', 'medium');
	script.setAttribute('data-height-mobile', 'medium');
	script.setAttribute('data-offset-x', '20');
	script.setAttribute('data-offset-y', '180');
	script.setAttribute('data-offset-x-mobile', '10');
	script.setAttribute('data-offset-y-mobile', '80');
	script.setAttribute('data-max-width-percent', '40');
	script.setAttribute('data-max-width-percent-mobile', '90');
	script.setAttribute('data-inactivity-seconds', '4');
	script.setAttribute('data-display-seconds', '6');

	document.body.appendChild(script);
});
</script>
<!-- End of Midrag Trust Reviews Widget for Inactivity -->

בואו ניכנס לפרטים:

הווידג'ט מגיב לגודל המסך ומתאים את עצמו לדסקטופ, טאבלט ומובייל. ניתן להגדיר מיקום, גודל ורוחב שונים למובייל ולדסקופ.
הווידג'ט מופיע אוטומטית לאחר תקופת חוסר פעילות של הגולש (ברירת מחדל: 4 שניות).
לאחר הצגה, הווידג'ט נעלם אוטומטית לאחר מספר שניות (ברירת מחדל: 6 שניות).
תנועת עכבר או מגע מאפסים את טיימר חוסר הפעילות.
ריחוף (hover) על הווידג'ט עוצר את טיימר ההסתרה.
לחיצה על X סוגרת את הווידג'ט והוא לא יופיע יותר ללקוח (גם לא בדפים אחרים באתר)
חוות הדעת מתחלפות אוטומטית ומוצגות לפי סדר. הווידג'ט זוכר את המיקום האחרון גם בין דפים באותו אתר.
הווידג'ט לא מפריע לגלילה או לשימוש באתר.
הקוד טוען את עצמו אוטומטית כשהדף נפתח.

התאמה אישית של הווידג'ט:

פרמטר חובה:

הפרמטר guid משייך את התו אליכם, ולכן הוא פרמטר חובה. אתם תקבלו אותו מאיתנו במייל, וכל מה שצריך לעשות זה להכניס אותו במקום הכיתוב הזה: 👉INSERT YOUR GUID HERE👈

פרמטרים פונקציונאליים:

הפרמטר data-inactivity-seconds קובע את זמן חוסר הפעילות (בשניות) לפני הצגת הווידג'ט.
הפרמטר data-display-seconds קובע את משך הצגת הווידג'ט (בשניות) לפני הסתרה.

פרמטרים עיצוביים:

הפרמטר data-position יקבע את מיקום הווידג'ט בגרסת הדסקטופ של האתר שלכם. אפשר לבחור: 'bottom-left' ,'top-left', 'top-right' , 'bottom-right'.
הפרמטר data-position-mobile מאפשר לשנות את מיקום הווידג'ט בגרסת המובייל של האתר.
הפרמטר data-height יקבע את גודל הווידג'ט בגרסת הדסקטופ של האתר שלכם. אפשר לבחור: 'large', 'medium' , 'small'.
הפרמטר data-height-mobile יקבע את גודל הווידג'ט בגרסת המובייל של האתר (מקבל את אותם ערכים כמו הפרמטר height).
באמצעות הפרמטר data-offset-x ניתן לשנות את המרחק האופקי של הווידג'ט מקצה המסך בגרסת הדסקטופ, ובאמצעות הפרמטר data-offset-y ניתן לשנות את המרחק האנכי מקצה המסך. את אותו הדבר ניתן לשנות במובייל באמצעות הפרמטרים data-offset-x-mobile ו-data-offset-y-mobile.
הפרמטר data-max-width-percent קובע את רוחב הווידג'ט המקסימלי כאחוז מהמסך בדסקטופ, והפרמטר data-max-width-percent-mobile עושה את אותו הדבר במובייל.

יצירת עמוד חוות דעת באתר שלכם

אנחנו ממליצים להשתיל את תוכן עמוד חוות הדעת בעמוד יעודי באתר שלכם (אפשר לשים אותו גם בתפריטים שונים, תחת הכותרת "לקוחות ממליצים", "חוות דעת מידרג" וכדומה).

זהו קוד ההטמעה להשתלת חוות הדעת באתר שלכם:

<div id="midragTrustContainer"></div>

<script 
  src="https://trust.midrag.co.il/external/embededCompanyCard.v1.js" 
  data-guid="👉INSERT YOUR GUID HERE👈">
</script>

הפרמטר data-guid משייך את התו אליכם, ולכן הוא פרמטר חובה. אתם תקבלו אותו מאיתנו במייל, וכל מה שצריך לעשות זה להכניס אותו במקום הכיתוב הזה: 👈INSERT YOUR GUID HERE👉