Gravity Field
English
English
  • Implementation
    • Gravity Field Implementation Types
    • Client-Side Implementation
      • 1. Gravity Field Script
        • Gravity Field Scripts Workflow
      • 2. Page Context
      • 3. Events
      • 4. Feed - General Requirements and Additional Parameters
        • Fashion
        • Electronics
        • Telecom
        • Banking and Fintech
        • eGroceries
        • Pets Supplies
        • DIY
      • 5. Cookies cloning with front-end implementation
      • Implementation on SPA-enabled sites
      • Multilingual / Multilocal Implementation
    • Server-Side API
    • Server-Side Hybrid API
    • Implementation Workflow
    • Passing User Data to Gravity Field
    • Client-side APIs
    • Obtaining "slid" from the browser console
    • Full Data Loader — Offline / Historical Purchases Onboarding
    • Full Data Loader — User Data Onboarding
    • Full Data Loader — Audience Export
  • GENERAL INFORMATION
    • Affinity Profile and How It Works
    • How to use regular expressions (RegEx)
    • Traffic Sources Identification
    • Targeting conditions definition and their applicability
    • Comparison of Targeting Conditions in Audiences, Front-end, and API Campaigns
    • Evaluators
    • Social Proof
    • What are Data Attributes
    • Technological Stack of Gravity Field
  • Platform Interface
    • Audience List View
    • Audience Creation Screen
    • Audience Targeting Conditions
    • Campaigns structure
    • Campaigns List Screen
    • Frontend campaigns creation
    • API Campaigns List Screen
    • API campaigns creation
    • Working with Templates
    • Working with Variables in Variations
    • API logs
    • Evaluators List View
    • Evaluator Creation Flow
    • Strategy List Screen
    • Recommendation Strategies Creation
    • Recommendation Strategies
    • User Management for GF Admins
    • Campaign Activity-logs
    • Dynamic Allocation
  • Running and QAing Campaigns
    • Disabling GF script
    • Campaign naming
  • Analytics
    • Personalization Campaigns Report
    • Outliers
    • Statistical Significance
    • A/B testing Approaches and Framework
    • A/A testing
    • Purchase data export
    • Campaings and Users Raw data Export
    • Approach to PoC Analysis
Powered by GitBook
On this page
  • 1. Implementing preconnect, prefetch & core.js scripts
  • 2. Implementing GF, Section ID, Page Context variables
  • Appendix

Was this helpful?

  1. Implementation
  2. Client-Side Implementation

1. Gravity Field Script

1. Implementing preconnect, prefetch & core.js scripts

On every site page in the <head> section:

<link rel="preconnect" href="//cdn-01.gravityfield.ai">
<link rel="preconnect" href="//evs-01.gravityfield.ai">
<link rel="dns-prefetch" href="//cdn-01.gravityfield.ai">
<link rel="dns-prefetch" href="//evs-01.gravityfield.ai">

Additionally, on every site page in the <head> section core.js script must be implemented:

<script type="text/javascript" src="//cdn-01.gravityfield.ai/core/core.js"></script>

2. Implementing GF, Section ID, Page Context variables

Each page must declare a GF variable. It is declared within a separate script consisting of three parts:

<script>
window.GF = window.GF || {}; 
GF.section = "111aaa222bbb"; // Section ID, string
GF.pageContext = { type: "PAGETYPE", data: [] }; // PAGETYPE and an empty array just as an example
</script>

  1. GF variable itself;

  2. GF.section - unique section ID which must be of string type;

  3. GF.pageContext - variable passing the information about the page context and its description. In the Page Context you can pass a localization parameter lng. You can use lng in the case that your site/app is available in more than one language/region and personalization campaigns need to adjust content according to the language/region. You can also use this parameter if there are different product attributes (price/discount amount, etc) in different regions/cities. More about page context: 2. Page Context

More about scripts: Gravity Field Scripts Workflow

Appendix

Example of correctly installed scripts on the shopping cart page:

<link rel="preconnect" href="//cdn-01.gravityfield.ai">
<link rel="preconnect" href="//evs-01.gravityfield.ai">
<link rel="dns-prefetch" href="//cdn-01.gravityfield.ai">
<link rel="dns-prefetch" href="//evs-01.gravityfield.ai">

<script>
window.GF = window.GF || {}; 
GF.section = "6315dda2f1c33ba4cd04655b";
GF.pageContext = {type: "CART",data: ["XD-154","DL-5874","TN-15","QSD-1581","XD-15"]};
</script>

<script type="text/javascript" src="//cdn-01.gravityfield.ai/core/core.js"></script>

Script connection order:

  1. Preconnect and prefetch;

  2. Declaring the GF variable and specifying a Page Context;

  3. Core.js.

PreviousClient-Side ImplementationNextGravity Field Scripts Workflow

Last updated 1 year ago

Was this helpful?