Third Step
Build Your Landing Page(s) in Google Sites
It's going to take a little while for Cloudflare to take over your settings, so we're going to take a break from that for a bit to work on the actual website design.
This first portion of the website is going to be strictly PG, with no full nudity. (Kink and financial domination themes ARE allowed though.) You should build it using the website admin email that we created in the first step OR another vanilla email. DO NOT use a gmail account where you have saved or intend to save adult content.
If you have two domains, you will want to complete all of these steps twice. One will be the PG landing page for your spicy business. And the other will be the vanilla landing page for your vanilla business, that you can put on your business cards and give to your bank and your family.
If you are only using only one domain, I would strongly reccomend making your naked top-level domain forward to a strictly vanilla page that does NOT link to your spicy or PG content. This can be given to your bank. Then the PG landing page would be somewhere like spicy.yourname.biz.
The first page we are going to build is your "Landing Page." Think of it like a customized linktr.ee page. It should include a basic bio, and links to important pages. You can link TO your adult content and your payment methods here, but we won't have them directly in this landing page. Visit Daddy.Werk.Baby to see a simple example. Note that example is similar to the landing page at Beast.Industries, that has a "Quick Links" section, which is one of the things that we will be building. Again, I reccomend that you build two separate ones, one vanilla and one PG. You should complete all the steps for both landing pages before moving on to the next step.
Browse to sites.google.com, and select "+ Blank Site." Be sure to look at the avatar at the top right corner and check if you are logged into the correct account. This will be very important later, as this account needs to be given permission to publish the page on your website.
The first thing we're going to do is set the colors and fonts and default banner image. You will do this by modifying one of the existing themes, or creating a new one. Both options are relatively simple and don't give you a whole lot of customization. Using a built in theme will allow you to customize one of the base colors, and select from just a few default fonts. The custom theme will allow you to set three custom colors and two default fonts from a virtually unlimited list of options.
Either way, it is a simple but important step, and it can be quickly changed later. You will want at least two, but preferably four, complimentary colors that we will use consistently in all the services we use. We will want to take note of the HTML codes for those 2-4 colors, to simplify things.
Below is a simple example showing some of the colors that I use for Beast.Industries.
If you're having trouble picking a color sheme, select a photo that you like, and upload it to imagecolorpicker.com. Play around with the options that it gives you until you have the 6-digit code for 2-4 colors that you like.
Now go back to the themes setting, and add those colors. Maybe start by just picking an existing them and adding your primary custom color by clicking on the paint bucket.
Take your time with this step. It is very easy to change later, but these colors are going to become part of your signature, so you want to be thoughtful about them. If you already have some preferred colors, or you have a palette that came with a logo or other media for your business, use that.
Now, use the insert menu on the right to add another image to the header, and some text. Mine is boring. Make yours better.
For making text larger or smaller, avoid directly changing the font size (say from 10-12.) Instead use the style options that appear over each text box. This will become important later when we are making larger pages like a FAQ page. But even for now, try to stick to switching between the existing styles like Normal Text, Small text, Title, Heading Subheading, etc.
At this point you are on your own for a bit. I've shown you a couple simple examples of "landing pages," but you can do better. If I were to give you very specific instructions here, it would be limiting.
Simply fill your page with some content.
- Experiment with different preset styles.
Think about all of the important places that you might send a client. (Payment methods, blogs, spicy content, whatever.) and write about it here.
Experiment with the "Content Blocks" feature on the right, to make it easier to add images next to blocks of text.
Then use control-k after selecting all those mentions of your payment methods and important apps and turn them into links.
Go down and add a footer with a copyright notice.
Handling embedded links and controlling what happens when you click them, (whether they pop out in a new window, redirect the current page, or do something in between) is a constant challenge in web development. Google sites greatly simplifies this by giving you very limited options, and automatically treating links a little bit differently depending how you entered them, and where they go. Links entered by typing control-k will behave a little bit differently when clicked than links entered through the button interface.
More important than that, there are essentially two different ways that you can enter links into that context screen. You can either copy and paste a link directly into the field, like the example on the left. Or you can select from a page within your own website from the dropdown menu, like the example on the right.
If you are linking to a page within your website, make sure to use that dropdown menu, instead of copying and pasting the link. If you use the dropdown menu, the link will behave more "intelligently" when clicked, and will keep working even if you make changes to the target page.
keep writing until your landing page is overfull. Then make a copy of it as a template to start a second page. Maybe a bio or a second links page, and move some of the stuff from the landing page over there. Just be creative. But before you finish this step, I want you to have a basic landing page, and just one other page that has some sort of useful information on it. Something, anything. Just make a second page.
Publish Your "Pilot" Site
Now, "publish" your site. Click the blue Publish button at the top right. You will get a context menu that will only show up the first time. The site name here will be used internally and will never be seen by clients, unless there is some sort of error, or when they are accessing password protected pages.
Leave the "Custom domain" option alone, as we will take care of that in the next step. And ignore the "who can manage my site" option, as google will default it back to private the first time you publish the site, anyways. You can see your site by clicking the context menu next to Publish > View published site. It may take up to 90 seconds for published changes to show.
Changes you make in google sites will not automatically show up to the world wide web. You will need to click the Publish button each time that you want your updates to be seen.