Header
Obviously the first thing you are going to need is a header. This header will contain a coat of arms or flag (whichever you prefer) as well as all of the links to your website's other pages. You can add and remove pages as you wish, just make sure that if you do so, you make sure to do it across all of your pages once you've finished!
- Code: Select all
[align=center][background-block=#0A4617][img]INSERT-COAT-OF-ARMS[/img][/background-block]
[background-block=#0A4617] [color=#0A4617].[/color][/background-block]
[background-block=#0A4617] [color=#0A4617]|[/color][background=#ffffff][color=#0A4617]Home[/color][/background][color=#0A4617]|[/color] [color=#ffffff][url=URL]Overview[/color][/url] [color=#24415B]|[/color] [url=URL][color=#ffffff]Government[/color][/url] [color=#0A4617]|[/color] [url=URL][color=#ffffff]Foreign Affairs[/color][/url] [color=#0A4617]|[/color] [url=URL][color=#ffffff]Military[/color][/url] [color=#0A4617]|[/color] [url=URL][color=#ffffff]Economy[/color][/url] [color=#0A4617]|[/color]
This is the code you will need for the header of each page on your website. You may notice that no link is provided next to the Home page on this codesheet and that is intentional, you need to remove the url tags from whichever page you are currently working on. Once you do this, ensure that all other pages have the url tags so any visitors may be redirected to the pages they wish to view. You can (and should) change the header's main color to your nation's primary color (just be sure to make sure all of the background tags for the text are modified as well).
You can see the finished product of my header on my home page!
Banner (Optional)
The next thing you can add is a banner just below the header (you don't have to do this but it can really add to the authenticity and appeal of the factbooks. The banner can be anything but for mine I chose a panoramic picture of Riga, Latvia (which you can see here. When using banners, be sure to use a different one for each page and make sure that the banner takes up the entire width of the page (if it doesn't it will look rather strange).
- Code: Select all
[color=#0A4617].[/color][/background-block][/align][align=center][IMG]INSERT-BANNER-HERE[/IMG][/align][hr][background-block=#8F1C1C][align=center][size=190][color=white][font=georgia]Welcome[/font][/color][/size]
[size=110][font=calibri][color=white][i]T O [tab=5] [/tab] N A T I O N
[/i][/font][/color][/size][/align][/background-block]
Just like in the Header section, I put all information you need to enter yourself (besides "T O") in caps. Try to keep the formatting of "T O N A T I O N" as it already is (it looks really nice that way) but you can mess around with it if you really want to. I highly recommend changing all of the subheaders to your nation's secondary color.
Body
Next we have the body. For the purposes of this example I will be using the body of the welcome page (as the overview page would require another tutorial which is located here). The welcome page's body should just be a little blurb about your nation similar to the first body of text in your nation's overview page (type of government, location, divisions, territories (if applicable), size and even your region if you so wish). The body is simply plain text so it won't require any coding to create!
Infographics (Optional)
Finally we have the Infographics section. This is a completely optional section but works much like advertisements and in-depth infographics would on many national websites! You will likely have to make them yourself which does take time, but they can be used in a really cool way. You can link to forum storefronts from ads you list in your nation's homepage, generating more traffic for your businesses and so much more.
- Code: Select all
[hr][background-block=#8F1C1C][align=center][size=190][color=white][font=georgia]Infographics[/font][/color][/size][/align][/background-block]
[center][url=FORUM-STOREFRONT-URL][img]INFOGRAPHIC[/img][/url][img]INFOGRAPHIC[/img][img]INFOGRAPHIC[/img]
[url=https://www.nationstates.net/nation=NATION/detail=people][img]PEOPLE-INFOGRAPHIC[/img][/url]
[/center]
Again be sure to update the colors to match the theme of your page. When making the infographics, make any ads small so you can fit them side-by-side and make the general information infographics large so they catch peoples' eyes.
Links
Below you will find links to some helpful tutorials and some examples of the finished product!
