Posts Tagged ‘step by step create splash pages in html editor’
There are times that I have made splash pages for various sites of mine and others that do not have the ability to add that splash pages within the actual sites. Traffic Exchanges have the script that allows you to add your splash pages in the site’s promotionals. Not all sites have that option. I am going to show you how to create unhosted splash pages.
Create the Splash Page:
First, go in and create your splash page in the same software that you have in the past. Save it as a gif, jpg, png whatever you have done before.
Then take this splash page and upload it into the cpanel of the site you want to represent, or if you Do Not have a cpanel, upload it into a site where you do.
Go to Images > Upload > then go down, find the splash page > Click on it > Go over to the right of this window , you will see the full Url, Click On It . Your Splash Page will show in the Cpanel’s browser window. Go to the browser window and copy this Url and paste it into a notepad.
Turn It Into Html:
At this point, you will need an Html Editor. There are many available – I have posted links to a few if you do not have one. Or if you know someone who has one, ask to use theirs. I personally use KompoZer.
Open your Html Editor. KompoZer always shows a “Tip for the Day”, just click close. Click on the “Table” icon at the top of your html editor’s toolbar. When it opens there are three tabs, choose “Precisely”, then Choose 1 Column, 1 Row. You can put in the width of your splash page if you wish, but you don’t have to, the table will adjust.
You will see your table on the screen. Go to “Format” on the Toolbar and choose “Table Cell Properties”. Click on the Tab for “Table” > half way down in that window you will see “Table Alignment” – change that to Center, then Click “Apply”, then “OK”
Your Table is now Centered on your Work Area Screen.
Go Back into “Table Cell Properties”. The Default Setting is the “Cell” tab – go over to the Right You’ll see “Content Alignment” Choose Vertical as “Top” and Horizontal as “Center”. Click “Apply” and “OK”.
When you click inside your table in the work area, your cursor should be centered.
On the Top Bar, click on the “Image” Icon – A window will open. Now, copy and paste that Url that you got from the cpanel into “Image Location”.
Be sure and click the box for “Don’t Use Alternate Text” that is a a little further down – then click OK
Your Splash page will appear in your work area!
Your cursor should be just to the right of your splash page image. – Hit return to bring it down just below the image. (sometimes you might not see the cursor flashing in order to find it. So just click over on the bottom side of the splash page and you’ll see it.)
Type in “Join Us” or whatever you wish to put in. You can change the font and color if you wish also.
Then “highlight your text” and go up to the “Link” Image on your toolbar, type in or copy and paste the Url to the site you want people to visit. “The Target Url. Example: http://ellensdesigns.ellenthorp.com/
Then Save your work – give it a name and it will be saved as an Html document!
Quick Note: Once you have saved the file, in your html editor Go To File then Choose Browse Page. Have your browser open when you do this. Your page will show on the browser. It should look the way you want it and the link you put in for Join Us or whatever works and takes you to the site. Nifty huh! If you need to make any changes, now is the time to do it. Just collapse your browser and make any changes you wish, Save Again and View it Again!
Go Back to your cpanel, and upload this file!
Go down and find it, click on it, click on the url to your right and grab the url that will appear in your browser that your cpanel opens the image in. You can also check and make sure the splash was done properly and it is centered.
Once you have the Url, you are set to go! Just plaster it everywhere!
I hope this has helped you with How To Create Unhosted Splash Pages. If you have questions, please feel free to email me, I’d be glad to help you out.
Here are a few links to some html editors, but go ahead and search for one that you’d like to use: