This documentation goes over everything needed for our Community Template.
Information about the configs and setup is all stated below.
Important Note
We do not recommended changing anything but theconfig.php
,json files
, andapplication files
at any time.
Also do NOT edit the very bottom lines of code inconfig.php
!
Once you have purchased the Community Template you will get access to download the bot.
If you are running it on your home PC we recommend getting xampp.
If you are running it on a webserver then it should work fine.
Go to your profile on our store page and you will see a download button. After you download you will get a .zip
file.
.zip
wherever you want the site's files to be..zip
file and drag the contents into the other file you created..zip
are in the folder where you want the site's files.This website template has a plethera of configurable elements built into the config files.
You can find a default config.php
in the Resrouce section of this page.
This defines the sites name. It only appears on the footer, search bar, tabs, and link embeds.
It will follow every page title after the "|".
This is the logo that will appear as the site favicon. It doesn't appear on any page.
This appears on the navigation bar and the link embeds, if enabled.
This is appears on the link embeds, search engines, and can be the home page text.
These are for SEO. They are not magic but can help with search resaults.
They need to be seperated by a comma, EXCEPT for the last one.
This is the main color that will be used across the website.
Must be hex, rgb, or rgba code. If using rgb or rgba you need to put the code like this: rgb(0, 0, 0)
| rgba(0, 0, 0, .5)
, and hex codes must start with the #
.
This is the color of all the buttons on the website.
Must be hex, rgb, or rgba code. If using rgb or rgba you need to put the code like this: rgb(0, 0, 0)
| rgba(0, 0, 0, .5)
, and hex codes must start with the #
.
This is the color of all the buttons when a mouse hovers over them.
Must be hex, rgb, or rgba code. If using rgb or rgba you need to put the code like this: rgb(0, 0, 0)
| rgba(0, 0, 0, .5)
, and hex codes must start with the #
.
This is the color of all the links on the website.
Must be hex, rgb, or rgba code. If using rgb or rgba you need to put the code like this: rgb(0, 0, 0)
| rgba(0, 0, 0, .5)
, and hex codes must start with the #
.
This is the color of all the text on the website.
Must be hex, rgb, or rgba code. If using rgb or rgba you need to put the code like this: rgb(0, 0, 0)
| rgba(0, 0, 0, .5)
, and hex codes must start with the #
.
This is the color that will appear on the left of link embeds.
Must be hex, rgb, or rgba code. If using rgb or rgba you need to put the code like this: rgb(0, 0, 0)
| rgba(0, 0, 0, .5)
, and hex codes must start with the #
.
If true
then $headerImage will appear on link embeds; if false
$headerImage will not be on embeds.
Value must be true or false.
This is the top button on the 404 / No application page.
Avalible Icons: discord, twitter, youtube, globe, facebook, tiktok, twitch
An avalible icon MUST be used and MUST be lowercase.
This is the text of the social button.
This is the link for the social button.
This defines if the button will show or hide.
Must be true or false.
This is the link the button will take you to.
This is the text that appears as the button.
This defines if the button will show or hide.
Must be true or false.
This is the link the button will take you to.
This is the type of icon that shows up.
IconTypes are either social
, internal
, and external
If social
then the Avalible Icons options: discord
, twitter
, youtube
, globe
, facebook
, tiktok
, twitch
If internal
the path must be within assets/img/
, but do not add assets/img/
If external
it must be a img link from the enternet
This is the text that appears on the button.
If true
the button under the hero text will be on, if false
, it will not.
Must be true or false.
The link for the button on the home page.
The text on the home page button.
The title that appears on the home page at the very top.
The text under the title on the top of the home page.
Leave as ""
for it to be $siteDescription.
If true
the button under the info section will be shown, if false
, it will not.
Must be true or false.
The title of the info section.
Leave as ""
to disable.
The image above the text for the colum.
The text for the colum.
If true
the button under the link section will be shown, if false
, it will not.
Must be true or false.
The title of the link section.
Leave as ""
to disable.
If the link will appear or not.
Must be true or false.
The link that users will be directed to.
The text that appears as the link.
If true
the button under the gallery section will be shown, if false
, it will not.
Must be true or false.
The title of the gallery section.
Leave as ""
to disable.
If the image will appear or not.
Must be true or false.
The link to the image.
Can be an internal or external link.
If true
the button under the gallery section will be shown, if false
, it will not.
Must be true or false.
The title of the gallery section.
Leave as ""
to disable.
If the link will appear or not.
Must be true or false.
The picture or logo for the team member.
The name of the team member.
The rank, title, or subheading that appears under their name.
The description for the person.
The title on the top left of the apply page.
The description to the right of the title.
If the section of applications will be active.
Must be true or false.
The title for that section of applications.
The Description for that section.
Leave as ""
to disable.
Information below is to help with editing the applications.json file found in the json folder.
This is where all the actual application data is stored for the apply page.
If you need a default copy head to the resources section.
Each section follows the same parameteres. Also, do not edit the section names (ie "mainApplication"
) and adding more sections will not do anything but possibly break something.
If you have more then one a ,
must be at the end of each {}, except the last.
{ "name": "Name of Application", "fileName": "The name of the file within the apps folder (no file extention)", "status": "Either Open or Closed (Caps don't matter)" }
For information on the apps files, head to App Files.
The title on the top left of the gallery page.
The description to the right of the title.
The images that appear on the gallery page.
They can be external or internal links.
The ""
must be arround the link, if the link has a quotation mark in it, put \
infront of it. And a comma must be at the end of all the link, outside the quote, except for the last.
The title on the top left of the team page.
The description to the right of the title.
Information below is to help with editing the teamMembers.json file found in the json folder.
This is where all the actual team member data is stored for the team page.
If you need a default copy head to the resources section.
Each grouping follows the same parameteres. Also, do not edit the section names ("teammembers"
) and adding more sections will not do anything but possibly break something.
If you have more then one a ,
must be at the end of each {}, except the last.
{
"name": "Their Name",
"rank": "Thier Rank (Appears under the name)",
"desc": "The description that appears under the name / rank.",
"imgLink": "An internal or external link to their picture (Appears at the top of the member box)"
},
This section goes over how to edit, add, and remove application files.
All information is relevent to files within the apps
folder, except the applcations.json
as that is in the json
folder.
NEVER EDIT THE
grabber.php
!
An example of a application file:
<?php
$appTitle = "First App";
$appDesc = "Lorem ipsum dolor sit amet consectetur adipisicing elit. Repudiandae, dolorem quisquam quas architecto, ut porro molestiae nihil reprehenderit, nulla facilis quam aperiam consectetur odit. Quidem laudantium nemo animi consequatur deleniti.";
$appLink = "https://docs.google.com/forms/d/e/1FAIpQLSc81OBt2FKIHBrw-Ob5WkI5Eg8G6oTpczOEvXDy3D96X7bGsQ/viewform";
?>
<div class="container">
<h1 class="header"><?= $appTitle ?></h1>
<p><?= $appDesc ?></p>
<div class="frame">
<iframe src="<?= $appLink ?>?embedded=true" allowfullscreen mozallowfullscreen webkitallowfullscreen></iframe>
</div>
</div>
To add a new application file simple do the following steps:
apps
folder with whatever name you want (must be all lowercase) and make sure the extention is .php
.applications.json
file with the new file name.applications.json
.Editing is not to hard, just be careful.
<?php ?>
phrase.Below are all the configs used for this bot. A default and blank version is provided incase you break something, want to start over, or need to look at the original configs.
<?php
// PLEASE REFER TO https://docs.shadowdevs.com/website/communitytemplate FOR HELP
/// SITE SETTINGS ///
$siteName = "My Community";
$siteLogo = "assets/img/logo.png"; // This is the favicon
$headerImage = "assets/img/banner.png"; // This also goes to the site's embed if enabled
$siteDescription = "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Suscipit illum saepe, modi dolorum molestias, optio possimus et consequatur dolorem porro vel cumque officiis non officia, dolores incidunt repellat corrupti iste.";
$siteBackground = "assets/img/bg.jpg";
$siteTags = "my community, my server, my website, designe by asp, asp, website";
// Site tags are for SEO, so include as many as you want and make sure to seperate them with a comma / space, EXCEPT the last one
$themeColor = "#4294ff";
$buttonColor = "#5d89d5";
$buttonHoverColor = "#4ea4bc";
$linkColor = "#81C4DF";
$textColor = "white";
$embedColor = "#4294ff";
$embedImageActive = true; // This will allow the $headerImage to appear on link embeds
$socialIcon = "discord"; // Avalible Icons: discord, twitter, youtube, globe, facebook, tiktok, twitch
$socialButtonName = "Our Discord";
$socialButtonLink = "https://discord.gg/fVrRa8z";
// ------------- //
/// HEADER BUTTONS ///
$buttonOneActive = true;
$buttonOneLink = "/";
$buttonOneText = "Home";
$buttonTwoActive = true;
$buttonTwoLink = "/apply";
$buttonTwoText = "Apply";
$buttonThreeActive = true;
$buttonThreeLink = "/gallery";
$buttonThreeText = "Gallery";
$buttonFourActive = true;
$buttonFourLink = "/team";
$buttonFourText = "Team";
$buttonFiveActive = true;
$buttonFiveLink = "/";
$buttonFiveText = "Change Via Config";
$buttonSixActive = false;
$buttonSixLink = "";
$buttonSixText = "";
/// ----------- ///
/// FOOTER BUTTONS ///
// IconTypes are either 'social', 'internal', and 'external'
// If 'social' then the Avalible Icons options: discord, twitter, youtube, globe, facebook, tiktok, twitch
// If 'internal' the path must be within assets/img/, but don't add that
// If 'external' it must be a img link from the enternet
$fbuttonOneActive = true;
$fbuttonOneLink = "/";
$fbuttonOneIconType = 'social';
$fbuttonOneImage = "discord";
$fbuttonTwoActive = true;
$fbuttonTwoLink = "/";
$fbuttonTwoIconType = 'external';
$fbuttonTwoImage = "https://png2.cleanpng.com/sh/b772b354626c60ca957d33037f7c3981/L0KzQYm3V8I0N6Z3fZH0aYP2gLBuTfNwdaF6jNd7LXnmf7B6TfNtcaEyeeR9LYT6ecX7hgIudJDsh59BZXP3f8O0VfI2Pmo4fqlsYUa5cYG1Usc6P2g7SKk6NUO1RIG3VsMyQGMASZD5bne=/kisspng-computer-icons-clip-art-twitter-logo-vector-5b5693f7ca66a0.2797760715324006318291.png";
$fbuttonThreeActive = true;
$fbuttonThreeLink = "/";
$fbuttonThreeIconType = 'internal';
$fbuttonThreeImage = "icons/question-circle-regular.svg";
$fbuttonFourActive = false;
$fbuttonFourLink = "";
$fbuttonFourIconType = 'social';
$fbuttonFourImage = "";
// ------------- //
/// HOME PAGE SETTINGS ///
$buttonHomePageActive = true;
$buttonHomePageLink = "#";
$buttonHomePageText = "Jump in Now!";
$heroText = "My Community";
$heroDescription = ""; // Leave blank to use $siteDescription
// INFO SECTION //
$infoSectionActive = true;
$infoSectionTitle = "Information"; // Leave blank to disable
$colOneImage = "assets/img/icons/users-solid.svg";
$colOneText = "Change the image and text in the config!";
$colTwoImage = "assets/img/icons/users-solid.svg";
$colTwoText = "Lorem ipsum dolor sit amet consectetur adipisicing elit.";
$colThreeImage = "assets/img/icons/users-solid.svg";
$colThreeText = "Quibusdam, inventore quam voluptate totam distinctio accusantium dolor porro natus error cum facilis
fugiat esse in vero ipsam iste suscipit iure labore.";
// LINKS SECTION //
$linksSectionActive = true;
$linksSectionTitle = "Important Links"; // Leave blank to disable
$linkOneActive = true;
$linkOneLink = '#';
$linkOneText = 'Cool Link 1';
$linkTwoActive = true;
$linkTwoLink = '#';
$linkTwoText = 'Cool Link 2';
$linkThreeActive = true;
$linkThreeLink = '#';
$linkThreeText = 'Cool Link 3';
$linkFourActive = true;
$linkFourLink = '#';
$linkFourText = 'Cool Link 4';
$linkFiveActive = true;
$linkFiveLink = '#';
$linkFiveText = 'Cool Link 5';
$linkSixActive = true;
$linkSixLink = '#';
$linkSixText = 'Cool Link 6';
// Gallery SECTION //
$gallerySectionActive = true;
$gallerySectionTitle = "Gallery Preview"; // Leave blank to disable
$galleryOneActive = true;
$galleryOneLink = 'https://randompicturegenerator.com/img/national-park-generator/ge4290ee08d35a651b01287320254787c28f0925b038712835227bec4a7be747aa3841fbf31e02123084616a2a5cb2791_640.jpg';
$galleryTwoActive = true;
$galleryTwoLink = 'https://randompicturegenerator.com/img/national-park-generator/g040c2d7badcf67cfa42895c620f11d85ebc3c91af796141f3c7da6ff1c89afb2b0b056772cf7f534cfc2261a55e192d6_640.jpg';
$galleryThreeActive = true;
$galleryThreeLink = 'https://randompicturegenerator.com/img/national-park-generator/g9db90a4895fd247d6ec1bdcc1f23670677923dd749071f7caa35f1e1515b1d5acd1c3ef3c325fdbb9a492d3e3f48f842_640.jpg';
$galleryFourActive = true;
$galleryFourLink = 'https://randompicturegenerator.com/img/national-park-generator/g82e9581f804cb8812a8f264b30a313f70c17421585eaab165e8dc8d08ad12eafb465894a23347e69f6610277727a9910_640.jpg';
$galleryFiveActive = true;
$galleryFiveLink = 'https://randompicturegenerator.com/img/national-park-generator/g324a81e8002ec6a7bf74b97306adbcbe4d7b62cb715dfef68858320c857db7b8d4e6334eb5ffa41e107116087fa146a5_640.jpg';
$gallerySixActive = true;
$gallerySixLink = 'https://randompicturegenerator.com/img/national-park-generator/ge189b3ac7a2c7b572f95e156382c641a80183d761c0242a6e9fb11beac41cb69a40af459035dcc6afc6e0ca28120ed85_640.jpg';
// TEAM SECTION //
$teamSectionActive = true;
$teamSectionTitle = "Community Leaders"; // Leave blank to disable
$personOneActive = true;
$personOneImage = './assets/img/person.jpg';
$personOneName = 'Guy 1 Name';
$personOneRank = 'Guy 1 Rank';
$personOneDesc = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Soluta libero, beatae deleniti, dicta iste modi nam pariatur fuga doloribus magnam, a quis! Fugit culpa molestias hic maxime ea atque laboriosam.';
$personTwoActive = true;
$personTwoImage = './assets/img/person.jpg';
$personTwoName = 'Guy 2 Name';
$personTwoRank = 'Guy 2 Rank';
$personTwoDesc = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Soluta libero, beatae deleniti, dicta iste modi nam pariatur fuga doloribus magnam, a quis! Fugit culpa molestias hic maxime ea atque laboriosam.';
$personThreeActive = true;
$personThreeImage = './assets/img/person.jpg';
$personThreeName = 'Guy 3 Name';
$personThreeRank = 'Guy 3 Rank';
$personThreeDesc = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Soluta libero, beatae deleniti, dicta iste modi nam pariatur fuga doloribus magnam, a quis! Fugit culpa molestias hic maxime ea atque laboriosam.';
// ------------- //
/// APPLY PAGE ///
$appsPageTitle = "Community Applications";
$appsPageDesc = "Below is a list of all our applications and their status. If you have any questions please contact us.";
$mainApplicationsActive = true;
$mainApplicationsTitle = "Main";
$mainApplicationsDesc = ""; // Leave blank to disable (applies to other application descriptions)
$secondApplicationsActive = true;
$secondApplicationsTitle = "Second";
$secondApplicationsDesc = "";
$thirdApplicationsActive = true;
$thircApplicationsTitle = "Third";
$thirdApplicationsDesc = "";
// CLOSED APPS PAGE //
$closedAppsImg = "assets/img/x.gif";
$closedAppsMessage = "The applcation you are trying to access is currently closed.";
// ------------- //
/// Gallery PAGE ///
$galleryTitle = "Gallery";
$galleryDesc = "Lorem ipsum dolor sit amet consectetur adipisicing elit. Incidunt consectetur quaerat laudantium.";
// You can use locally stored images or ones from the online, but if they come from online ensure the link ends with a image file type such as .png, .jpg, .svg, etc
$galleryImages = [
"https://i.imgur.com/SKP3kxJ.jpeg",
"./assets/img/titanfall-wallpaper.jpg",
"./assets/img/sandclones.jpg",
"https://cdn.discordapp.com/attachments/699728783669854368/806536887208378368/unknown.png",
"https://i.imgur.com/pJ7SiDb.jpg",
"https://cdn.discordapp.com/attachments/699728783669854368/817151847373996043/6c905fd36788c6f1b270142d71de2c65.png"
];
// ------------- //
/// TEAM PAGE ///
$teamTitle = "Team";
$teamDesc = "Lorem ipsum dolor sit amet consectetur adipisicing elit. Incidunt consectetur quaerat laudantium, deserunt officia itaque fuga esse odit, aliquam similique.";
// ------------- //
// Please go to applications.json / teamMembers.json to edit applications information veiwed on the apply page.
// DO NOT EDIT BELOW THIS | THIS READ / OUTPUTS applications.json / teamMembers.json TO PHP READABLE PARSE //
$applications_json = file_get_contents('./json/applications.json');
$decodedApps = json_decode($applications_json, true);
$mainApps = $decodedApps['mainApplications'];
$secondApps = $decodedApps['secondApplications'];
$thirdApps = $decodedApps['thirdApplications'];
$applications_json = file_get_contents('./json/teamMembers.json');
$decodedApps = json_decode($applications_json, true);
$teamMembers = $decodedApps['teammembers'];
{
"mainApplications": [
{ "name": "First App", "fileName": "first", "status": "Open" },
{ "name": "Second App", "fileName": "second", "status": "Closed" }
],
"secondApplications": [
{ "name": "Third App", "fileName": "third", "status": "Closed" },
{ "name": "Fourth App", "fileName": "fourth", "status": "Closed" },
{ "name": "Fith App", "fileName": "fith", "status": "Closed" }
],
"thirdApplications": [
{ "name": "Sixth App", "fileName": "sixth", "status": "Closed" },
{ "name": "Seventh App", "fileName": "seventh", "status": "Closed" }
]
}
{
"teammembers": [
{
"name": "Bob",
"rank": "Owner",
"desc": "A cool person.",
"imgLink": "./assets/img/person.jpg"
},
{
"name": "Joe",
"rank": "Owner",
"desc": "A cool person.",
"imgLink": "./assets/img/person.jpg"
},
{
"name": "Jim",
"rank": "Co-Owner",
"desc": "A cool person.",
"imgLink": "./assets/img/person.jpg"
},
{
"name": "Tom",
"rank": "Manager",
"desc": "A cool person.",
"imgLink": "./assets/img/person.jpg"
},
{
"name": "Tony",
"rank": "Admin",
"desc": "A cool person.",
"imgLink": "./assets/img/person.jpg"
},
{
"name": "Bobby",
"rank": "Admin",
"desc": "A cool person.",
"imgLink": "./assets/img/person.jpg"
}
]
}