How to post to the steem blockchain remotely from any webpage
utopian-io·@akintunde·
0.000 HBDHow to post to the steem blockchain remotely from any webpage
Posting remotely to the steem blockchain might come handy in any situation and that is the more reason why I am posting this tutorial to give guidelines on how that can be done.
All you need for this to be possible is just some javascript , html, a little php and that's all. You don't even necessarily need a server, it can all be done from your home browser, if you exempt the php variables and write directly.
We will only be making use of a single html.
So the steps below explains how to create the different sections of the file after you have created an empty html file that I suggest you name "Index.php" because I will be giving a little php addition to the script though it is not necessary for all situations.
## Step1: Create the HEAD.
Copy the codes below as HEAD for the html
````
<html>
<head>
<title>steem-js posting example</title>
<script src="jquery.min.js"></script>
<script src="https://cdn.steemjs.com/lib/latest/steem.min.js"></script>
<script language="JavaScript">
function postArticle()
{
steem.broadcast.comment(
'<?=$postingKey?>',
'<?=$author?>',
'<?=$mainTag?>',
'<?=$userName?>',
'<?=$permLink?>' ,
'<?=$title?>' ,
'<?=$body?>',
{ tags: [<?=$xtraTag?>], app: '<?=$appName?>' },
function (err, result) {
if (err)
alert('Failure! ' + err);
else
alert('Success!');
}
);
}
</script>
<link href='https://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>
</head>
````
This above codes contains the javascript functions that will control the whole process of posting , so read attentively as I explain the codes.
> steem.broadcast.comment
This is the steemjs function that is used for posting and commenting as both posting and commenting as seen as same thing on the steem blockchain
> $postingKey
This refers to your Posting Key, not your master key . There is a posiibility of error occuring if you used other keys apart from posting key. The posting key can found in the transfer (permission)section of your steemit profile page
> $author
This can be left empty. Just pass an empty string
> $mainTag
Ever noticed that every post on steem has a major tag section that can not be edited even while updating all already written post. That is what this variable represent so whatever you do, remember it is permanent.
> $userName
This simply refers to your username
> $permLink
Every Post created has a perm link attached to it. the permLink represent the structure of the url. In this case, you are allowed to pick how you want your permlink to look like. A permLink always look like this seperated by dashes.
**how-to-make-php-powered-drag-and-drop-upload-page**
Be careful what you pick here too because it can also not be changed. It'a permanent entry.
> $title
This simply refers to the title of the article you are posting
> $body
This simply refers to the body of the article you are posting. I will advise that you are careful of formatting here to avoid javascript error , always inspect the codes during error using the inspecting element of your browser.
> $xtraTag
This is the extra tag that comes with an article apart from the main unchangeable tag I mentioned earlier.
> $appName
This is just to state the app you are posting from. You could just use 'steemjs-test!' if you don't know what to write.
Mind you, all this php variables needs to be assigned certain values for your script to work effectively and if you prefer, you can remove the php variables and write directly.
## STEP 2: Create the Body and close the HTML TAG
Just copy this code as follows:
````
<body onLoad="postArticle()">
</body>
````
The above codes means the javscript will automatically run when the page is loaded. This makes this script easy to sue as a cron job in case of absential and scheduled posting.
Then close the html tag with `</html>`.
When you run this page, you see a success alert , that means your post has been submitted to the blockchain and it is now visible on your profile.
<br /><hr/><em>Posted on <a href="https://utopian.io/utopian-io/@akintunde/how-to-post-to-the-steem-blockchain-remotely-from-any-webpage">Utopian.io - Rewarding Open Source Contributors</a></em><hr/>