Including Interactive Spreadsheets in Blogs

  • Does anyone know a good way to include interactive spreadsheets in WordPress? I’ve tried using output from Spreadsheet Converter, a program that takes excel files and turns them into html, but when I insert the correct html into WordPress along with my blog text the result is deformed. Anyone out there who successfully puts interactive spreadsheets into their blog?

Viewing 14 replies - 1 through 14 (of 14 total)

  • Not that I can remember… but putting any kind of html code into the wysiwyg/visual editor results in “deformed” stuff.
    If you wan to use your own html code in your posts – disable/turn off completely the visual thing:
    admin > Users > Your profile

    Moderator Samuel Wood (Otto)

    (@otto42)

    www.ads-software.com Admin

    Use Google Spreadsheets (part of https://docs.google.com ). When you make a new sheet, you can “Publish” it. After you do so, one of the options it gives you is at the bottom right of the screen and labeled “More Publishing Options”. Click that. In the resulting window, select “HTML to embed in a webpage” as the file format, and then follow through the rest. The result will be an HTML snippet (an iframe, actually) that you can put into a post or your theme or something to show the embedded spreadsheet right there on the page.

    Once you have the iframe code, you can fiddle with the width and height parameters to change the size of the sheet display.

    Here’s an example of one on Google’s Blog:
    https://googlesystem.blogspot.com/2006/11/major-update-in-google-spreadsheets.html

    Thread Starter julianjw2

    (@julianjw2)

    Thanks for the quick responses!

    moshu, I switched to code view before entering my html, so when I followed your instruction to uncheck “Use the visual editor when writing” and redid the post there was no change. Otto42, thank you for the suggestion. Do you know if there’s a way to embed GoogleDocs html in a way that doesn’t result in frames around the spreadsheet?

    I’ve put exactly the same text and code into both my ColdFusion articles edit and my WordPress blog edit, here are the results:
    ColdFusion: https://www.ecoworld.com/home/articles2.cfm?tid=96
    WordPress: https://www.ecoworld.com/blog/2006/08/14/photovoltaic-powered-cars/

    I’ve tried using exactly the same text/code, so that’s not the problem. As you can see, the WordPress result is deformed. Anyone know why or how to fix it? Thanks!

    I switched to code view before entering my html,

    That’s not the same as turning it off. If you just switch – the wysiwyg animal is still ON!

    Thread Starter julianjw2

    (@julianjw2)

    moshu, I also tried unchecking “Use the visual editor when writing” in both of my accounts, logging out, logging back in, creating a fresh post, and putting just the spreadsheet code in. So it has been turned off. Here’s the result:
    https://www.ecoworld.com/blog/?p=253
    It’s deformed.
    I know there’s nothing wrong with the code, because it gives perfect output in my ColdFusion interface. Here’s the code:
    https://www.ecoworld.com/funds/header.txt
    https://www.ecoworld.com/funds/body.txt

    I assume the “header” portion should go into the <head> section of a webpage. Did you include it in some way into the header of that specific Page/post?

    If you put the code as it is in the files you posted above… that will never work: there a lot of line breaks and tabs where they shouldn’t be.
    Cleaning up that code might help…

    Thread Starter julianjw2

    (@julianjw2)

    There’s no option in the WordPress interface to input into the head, only into the body. I don’t know enough about the files WordPress creates or where it puts them on the server to know how to access the blog post and manually change the html. If I did, I could try that.

    I think you’re on to something about the line breaks and tabs. They’re not in the code though, they’re getting added by WordPress. WordPress adds unnecessary (and potentially damaging) <p>s and <br>s to my code because it thinks it’s just blog text. Is there a way to tell WordPress not to format certain parts of the blog post?

    So, then do NOT post what has been damaged by WP but the original!
    Even what you have posted I made it to work on a local install after adding the head part to the header.php and the body into a post – after reformatting all that bad line breaks etc. in a text editor. It has one little style glitch (didn’t have time to check line by line) but basically it works ??

    Thread Starter julianjw2

    (@julianjw2)

    I always use the original code that WP has not modified.

    I take it that you put the body part in a post… how did you make it so WP did not add <p> and <br> tags when you hit submit?

    Thread Starter julianjw2

    (@julianjw2)

    okay, making some progress by deleting spaces in the body and putting the header in header.php… I’m hoping deleting spaces in the header will work too. There’s only one header.php and the header is different for each spreadsheet so that will have to go in the body of the post along with my body code. Luckily style sheets can be in the body…

    Hi everybody,

    is there a way to make a spreadsheet interactive though?
    Like a calculator. Visitors can use the base of the spreadsheet which they can’t edit.
    But they can put in their own numbers in areas of the spreadsheet.
    Is there a way to do this?

    Thank you
    Naomi

    Yes Naomi. Embed Zoho Sheet using an iframe in your WordPress page.

    Thanks srikat – found Zoho and looked it over. Is this a secure place to store personal details, eg. membership lists? Our WordPress site is members only and seems secure. I just wonder if an iframe pointing out to another server is acceptable.
    Thanks

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘Including Interactive Spreadsheets in Blogs’ is closed to new replies.