What is the best solution for integrating interactive graphics suitable for read

• 

  contactaf1b6acd05 · Member · Mar 16, 2024 at 2:22 pm

  • Copy link
  • Add topic to favorites

  Hello,

  I’d like to create a blog dedicated to popularising subjects related to ecology. To do this, I plan to use a Python library for creating interactive charts (the Plotly library). My problem at the moment is that I can’t find a simple way of doing it on WordPress.

  My charts are hosted in Chart Studio, and to integrate them into a web page I can either embed an “iframe”, but this option doesn’t seem possible in WordPress, or embed a block of HTML code, but this option doesn’t seem to maintain the interactive side of the chart. What’s more, the chart also needs to be able to be adjusted so that it can be read on a mobile phone, either by automatically resizing the chart or by setting parameters in the HTML code (or CSS) so that users can scroll up and down or left and right, depending on the format/size of the chart.

  So my question is this: are there any options for simple management of these issues in some WP packages? If so, what would be the minimum formula that would allow me to do this? Knowing that this is really the only option I really need; beyond that I intend to have a very simple blog, with no transactions or anything else.

  In case you need an overview of the type of visualisations I plan to use :

  https://plotly.com/~MichaelGauthier/4/

  Thanks in advance for your replies.

• 

  staff-oikake · Staff · Mar 18, 2024 at 9:07 am

  • Copy link

  Hi,

  It is possible to embed iframes in WordPress.com, but a Creator plan or higher would be needed. Here you have more info about this:

  

  Blocks (The Full List) » Custom HTML Block

  in WordPress.com Support

  2 min read

  Use the Custom HTML block to add HTML code and preview it as you edit it. This guide will show you how to use this block to add code to your website. Add the Custom HTML Block To add the Custom HTML block, click the + Block Inserter icon and search for “HTML”. Click to add the block to a page, post, or template. Adding a Custom HTML block 💡 Using your keyboard, you can als

  It is also possible to use custom CSS. An Explorer plan would be needed in this case (the Creator plan includes all the features from the Explorer plan):

  

  Add Custom CSS

  in WordPress.com Support

  6 min read

  While most changes can be made with settings in the WordPress editor, you may prefer to use CSS to customize your site if you have experience writing CSS code. This guide will show you how to edit your website with CSS. This feature is available on sites with our WordPress.com Explorer, Creator, and Entrepreneur plans. If your site has one of our legacy plans, it is available on the Pro plan.

  Here is info on the different plans:

  

  Choose a WordPress.com Plan

  in WordPress.com Support

  5 min read

  Choose WordPress.com to build your website with lightning-fast hosting, intuitive editing, and everything you need to grow your audience. This guide will help you decide which WordPress.com plan suits your needs. Included For Free No matter which plan you choose, including the free version of WordPress.com, your website will come with the following: The Essentials Best-in-class ho

  Also, for pricing and a handy plan comparison table, please see https://wordpress.com/pricing/

  Hope this helps. If you need further assistance with this, don’t hesitate to let us know!

• 

  contactaf1b6acd05 · Member · Mar 18, 2024 at 3:02 pm

  • Copy link

  Thanks a lot for your reply!

  I was afraid that iframes wouldn’t be available below the Creator plan indeed, but thanks for confirming…

  The custom CSS would be nice, but my problem is that as far as I know, in order to embed an interactive chart, I need either to embed it via an iframe (and the document/chart is stored on another website), or store the HTML document within my WordPress. However, at the moment, with the free plan I am unable to store HTML documents. Is it possible with higher tiers? I couldn’t see any information on that in the links you provided. I think that, combined to the custom CSS would be my best bet.

  The other option would be to store the chart on another website, and embed the HTML, but the charts being a bit complex, the HTML <div> bit is quite long and makes the page freeze, so embedding that is not an option either.

  Do you know of any other method I could use? I wouldn’t mind contracting a paid plan, but to be frank, 25€/month just to embed charts would be too much for me, hence my questions regarding other options.

  Thanks a lot for your help again!