DownloadsDocumentationAPI ReferenceChangelogOpen A TicketContact

It is possible to integrate SearchBlox widget with **Drupal Site Pages** using the following steps:

### ** Step 1:** Copy Widget/Embed Search Code

Select required widget settings and copy the Widget a.k.a Embed Search Code from your SearchBlox Admin Console > Embed Search screen Reference: [Embed Search Configuration](🔗)

_Selecting required widget settings and generating SearchBlox Embed Search Code reference:_

1811


_Copy SearchBlox Embed Search Code reference:_

1534


### ** Step 2:** Configuring Custom Block

  • Log in to your Drupal Website Admin Panel

  • Go to Structure Tab and Click on Block Layout

1662


  • Choose any section to integrate your widget code with a custom block. For Eg: Let's choose a Content block and click on Place Block

1643


  • Enter the name of the block and Convert the page to Full HTML content to paste your copied widget code into Source for Initial HTML view. Click Save.

914


### ** Step 3:** Integrating Custom Block with Site Page(s)

  • Uncheck the Display Title of your custom block and Check the required pages under Content Types Tab where you want to display the widget

922


  • Save Block to apply the Changes

  • Once you create and Save the custom block you will see created custom block in the list.

1719


  • Scroll down to the bottom of the page and click Save Blocks

1687


  • Go to your site page to check your widget

1831


  • Search Results will be displayed in the content area.

1841


### **Embed Code Updates**

If any changes in widget code, you can easily customize by editing your custom block. Here is an example: Sometimes existing drupal site page may cause CSS overriding issues. To fix this issue please add this below CSS style tag to your custom block: `<style type="text/css">.login-firstbar {position:relative !important} #root a {border:none !important }</style>`

1571


Copied CSS update reference:

1071


Note:

  1. Configure sb_plugin_domain in your custom UI configuration file facet.js or using input tag below: `<input type="hidden" id="sb_plugin_domain" value="https://searchblox.domain.com"/>`

  2. Ensure you whitelisted your drupal domain with SearchBlox CORS configuration. Reference: [Enable CORS](🔗)

  3. Make sure you apply a valid SSL certificate for your SearchBlox Application for secure access. Reference: [SearchBlox SSL Setup](🔗)

Please contact SearchBlox Support for any further help.