CODEWITHSUNDEEP
javascriptwordpressgoogle-sheets
crloa
crloa

Reputation: 113

Import data from Google Spreadsheet cell to WordPress

I'm trying to get a cell text from a Google Spreadsheet and insert into a post on WordPress using this code, but I'm pretty bad on JavaScript that I don't even know how to get the text without the alert.

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js">    </script>
</head>
<body>
    <script>
        $.ajax("https://docs.google.com/spreadsheets/d/e/2PACX-1vQhp9yFq8eXagN03gn-mCN3_KPWRc2EIpswDFpHJLflFOG-XU2OMktqj03gxvUBZMAp8gYwWO5Q3MVJ/pub?gid=942917560&single=true&range=d3&output=csv").done(function(result){
            alert(result);
        });
    </script>
</body>

Upvotes: 0

Views: 698

Answers (1)

user5734311
user5734311

Reputation:

In your Wordpress post, go to Text mode and add a div 

<div id='spreadsheet'></div>

Now in your script do this to set the contents:

jQuery.ajax("https://docs.google.com/spreadsheets/d/e/2PACX-1vQhp9yFq8eXagN03gn-mCN3_KPWRc2EIpswDFpHJLflFOG-XU2OMktqj03gxvUBZMAp8gYwWO5Q3MVJ/pub?gid=942917560&single=true&range=d3&output=csv").done(function(result){
    jQuery("#spreadsheet").text(result);
})

WordPress usually comes with jQuery, you don't need to add it yourself. You need to replace $ with jQuery though.
You can also do this:

jQuery(function($) {
    $.ajax("https://docs.google.com/spreadsheets/d/e/2PACX-1vQhp9yFq8eXagN03gn-mCN3_KPWRc2EIpswDFpHJLflFOG-XU2OMktqj03gxvUBZMAp8gYwWO5Q3MVJ/pub?gid=942917560&single=true&range=d3&output=csv").done(function(result) {
        $("#spreadsheet").text(result);
    })
});

This will a) only run the function after the document is loaded and b) allow you to keep using $ in your code.

Upvotes: 1

Related Questions