Perkswall Integration Page

overview the perkswall integration page provides a centralized dashboard for configuring and customizing your perkswall you can manage styling, adjust settings, and preview changes in real time for both mobile and desktop views customize the look and feel to match your brand configure display options, advanced behaviors, and offer presentation instantly see how your perkswall appears on different devices navigation accessing the perkswall integration page is simple, just by clicking https //app momentscience com/account/integration/perkswall or navigate from your dashboard by following these steps click on " integration " in the left sidebar of the dashboard then, click on " perkswall " you'll now find yourself on the perkswall integration page, where you can begin customizing your perkswall to suit your needs settings customization general settings the general settings section allows you to customize the branding of your perkswall to align with your company’s visual identity true 0,297left unhandled content type left unhandled content type unhandled content type left unhandled content type left unhandled content type unhandled content type left unhandled content type left unhandled content type unhandled content type style settings the style settings section lets you customize the look and feel of your perkswall header, text, and tiles these settings give you control over branding, layout, and color schemes to match your organization’s identity header style choose one of the following options for your perkswall header background true 0,280left unhandled content type left unhandled content type unhandled content type left unhandled content type left unhandled content type unhandled content type left unhandled content type left unhandled content type unhandled content type left unhandled content type left unhandled content type unhandled content type left unhandled content type left unhandled content type unhandled content type custom header integration the custom header option enables direct dom manipulation of the perkswall header, allowing advanced control over layout, branding elements, and styling customization is achieved using standard html, css, and javascript this option is intended for publishers who require precise control of the header structure beyond the light, image, or color presets dom structure and selectors true 238left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type these ids are injected by the perkswall web sdk at runtime and are available once the header has been rendered in the dom example programmatic customization the following javascript example demonstrates dom element targeting using getelementbyid() content injection (createelement + appendchild) layout modification using flex direction and alignment properties style overrides applied via the element style property new element creation (link injection) inside the header description // 1 access the logo container const logocontainer = document getelementbyid('adpx pub image container'); // 2 inject "sponsored by " label const sponsormessage = document createelement('div'); sponsormessage innertext = 'sponsored by '; logocontainer appendchild(sponsormessage); // 3 reverse logo container order (flexbox) logocontainer style flexdirection = 'row reverse'; // 4 access header container (full header) const headercontainer = document getelementbyid('adpx perkswall headercontainer'); // 5 override header container styles headercontainer style flexdirection = 'column reverse'; // swap vertical order headercontainer style alignitems = 'flex start'; // left align content headercontainer style backgroundcolor = 'white'; // solid background headercontainer style padding = '0'; // remove default padding // 6 access header text container const headertextcontainer = document getelementbyid('adpx mini desc'); // 7 apply custom header text styling headertextcontainer style width = '100%'; headertextcontainer style textalign = 'left'; headertextcontainer style backgroundcolor = '#6e9eda'; headertextcontainer style padding = '12px'; // 8 create a new link element and inject it const newspan = document createelement('span'); const newlink = document createelement('a'); newlink href = 'https //your link com'; // destination url newlink innertext = 'learn more'; // link text newspan appendchild(newlink); headertextcontainer appendchild(newspan); text style settings the following options control the typography of text elements on the perkswall page true 133,118 unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type unhandled content type tile style settings true 177,122left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type theme settings true left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type featured offers the featured offers tab appears only when show featured offers is enabled in theme settings this section controls the behavior and appearance of the featured offer carousel true left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type left unhandled content type managing featured offers the manage featured offers tool lets you control which offers appear in the featured offers carousel and in what order click "manage featured offer"s in the theme settings tab to open a popup listing all offers provisioned to your account selecting offers tick the checkboxes next to the offers you want to feature you can select up to 15 offers at a time selected offers will be added to the featured offers in order of delivery list, which determines the display order in the carousel prioritizing featured offers drag and drop any offer row to set its priority offers higher in the list have greater priority and are displayed first the carousel can display up to 3 offers at a time, in the exact order you define invalid or unavailable offers are automatically skipped at runtime, ensuring only valid offers appear to the user use the handle icon (≡) on the left of each row for smooth reordering