As I detailed yesterday, about building a widget in Netpond, I won’t go over the basics again, unless you are unsure about something, if you are just post it here, and I will try and answer the questions! (Hey, I have only been looking in to this, a little under 24 hours!)
To help you along, a little, I have built a widget resource pack, which, surprise, surprise, is for the promo of my own site! Download it
here. It is just over 4mb in size, because I have included the images, to give an idea of the overview.
It is very simple to get everything working right, but I will point out that the widget functionality
does not support PHP as a native standard, I am unsure if they support Javascript either, for that matter, because I have not been able to have a look in the code to which they are built. Basically, they are static web displays. As my tutorial went yesterday, I packaged all the functionality up and shipped that off to a server, and then in the code for the widget packaged it in an “I”frame. This is so you do not lose the PHP or if you decide on a bigger and better, the Javascript/flash/whatever functionality.
Ok, to modify the resource pack, which I have built last night (twenty minutes, because of a thunderstorm which took out the power!) I will detail below how to modify it for your own promo purposes.
1. Decompress the widgettutorial.zip to somewhere memorable in your machine.
2. Open the “Widget.html” file in any editing package of your choice.
3. Add your own background, by cutting an image to the dimensions of 180x250px. Then save this in to the “widgimg” folder, in whatever file format you should desire.
4. Find the entry that says:
PHP Code:
#frame {text-align: center; height: 250px; width: 180px; clear: both; background-image: url(http://127.0.0.1/widgimg/back.png); background-color: #000000; }
and change the server address to whatever your website is, and the ‘back.png’ to whatever your image file name is. Remember, this is going to be running on the computer of the user, so this is important that you get this right to start with! Also remember to make the background graphic to the size of the #frame div tag, or larger, so it doesn’t look like a s*** in a bucket.
5. Now, next find the entry of “I”frame, and which should look like this, with the spaces removed in the I word...
PHP Code:
<I frame src="http://127.0.0.1/widg.php" height="210" width="143" scrolling="No" border="0"></I frame>
and replace the server address with whatever your website is called.
6. Now, find the link below this, to navigate to the site of your choice, but remember to put in your affiliate ID in to this link!!! (The reason for this is the visitor may download the widget, without directly becoming a member, and I would hate you to lose out on the hard work you have put in to building this box of tricks, when they finally do!) The link is the bit that looks like
PHP Code:
<a href="http://www.nenablue.com" target="_blank">Visit Nena Blue</a>
Make sure you do not adjust the target because if not, the website will attempt to open in the widget, itself; and the user will bin the widget in a heartbeat.
7. Adjust the title of the website in the same line, so instead of “Visit Nena Blue” it will become “Visit This Site, or Whatever!”
8. Open up Amnesty Generator, which you should have snagged yesterday, if you were following the preceding tutorial, and build the “Widget.html” file that you should still have open in your editor of choice, into a widget. Give it a memorable name, and the size of 180x250. This is a good size to be visible, but not swamp the user’s widget bar, or desktop.
9. Open up Widg.php, and change the line that says:
PHP Code:
http://127.0.0.1/widgimg/<? print $today ?>.jpg
to reflect the path to your website. Save it, that is the only adjustment that needs to be made to this.
10. To adjust the images, collect the thumbs or gallery images from your affiliate site, over the month, and cut them to the size of 133x200px, in whatever image editor you use.
11. Rename the files from 01 to 28, 30, 31, depending on the days of the month you are promoting for, but remember you MUST have the complete month accounted for, don’t think that you can skip a couple of days, because your user will think it is broken and bin it!
12. Upload Widg.php and folder “widgimg” to the root of your server, unless you have specified in the coding of Widg.php and widget.html.
13. When it comes to the last day of the month, or a day specified for changing the images, then you just cut the next month’s images to size, rename to the correct convention and upload them to the widgimg folder.
PLEASE NOTE: The implementation of this, is your own choice, not because “MountainGoat said so…” and also the other thing is, that the references to 127.0.0.1 are my testing server and they are the lines that you replace for your website!