Embed advanced

You can set up and control advanced settings for your Riddle embed.

  1. Go to the PUBLISH step and click on Embed / Landing page.
    go to embed section
  2. Click on ADVANCED.
    go to embed advanced
  3. Enable Boost your SEO / Google ranking to get more traffic to your site.
    boost seo
    Your embed code will include all the text from your Riddle, including questions, answers, and explanations. This will be readable by Google and will help boost your site's SEO ranking.
  4. Enable Auto scroll to change the display of your Riddle.
    set up auto-scroll and sticky header
    Riddles normally jump back to the top after each question. If this is not working for your website, you can try this option.
    • Enable Use a 'sticky' header on your site if your Riddle appears under a header bar on your site. This ensures your Riddle is pushed down that amount so it will always appear below it and be fully visible to your audience.
    • You can then enter a height into the Auto scroll offset field.
      We recommend starting with 150px and adjusting as needed. Or you can also measure the height of your menu bar in pixels. Chrome has some free extensions like this one. Alternatively, start with 150px and adjust as needed.
  5. Change the Max. width if you want to make your Riddle wider or narrower on the site where it is embedded.
    max width
    We recommend 640px.
    Our standard embed code will resize automatically for smartphones and tablets. For example, if you set your max width to 1200px (almost full page), your Riddle will still resize automatically to smaller screens.
    Please note: Resizing only works with JavaScript and CSS enabled.
  6. Enable Set fixed height if you want to make your Riddle taller or shorter on the site where it is embedded. You can then enter an iframe height and select the unit from the dropdown menu.
    set fixed height
  7. Enable Lazy load images to load images 'just in time' before they reach your audience.
    lazy load images
    When it is disabled, all your Riddle images are loaded before letting your audience start the Riddle.
  8. Enable Lazy load Riddle to only load your Riddle when it is actually visible to your audience (recommended). This speeds up your page's load times.
    lazy load riddle
    When it is disabled, the Riddle loads every time the page loads.
  9. Enable No JavaScript to removed JavaScript from our embed code.
    no javascript
    Riddle embed codes work in 99% of all web tools but this can help if you are still having issues. The downside is your Riddle will not resize automatically to smaller screens.
    • Enter the height and select the unit from the dropdown menu.
    • Enable No CSS to deactivate CSS being embedded.
  10. Click on COPY and re-embed your Riddle.
    copy embed code again
    Riddles normally update automatically but this feature will change your original embed settings so you need to paste it again.