https://wiki.soholaunch.com/api.php?action=feedcontributions&user=Soho&feedformat=atomSohowiki - User contributions [en]2024-03-29T15:44:02ZUser contributionsMediaWiki 1.18.1https://wiki.soholaunch.com/index.php?title=Building_a_Twitter_Bootstrap_templateBuilding a Twitter Bootstrap template2015-02-19T19:55:02Z<p>Soho: updated the bottom list for clarity</p>
<hr />
<div>The following is a guide for creating a Soholaunch template with Twitter Bootstrap.<br />
<br />
Here’s the complete working template file that this guide uses: http://site.soholaunch.com/media/bootstrap-basic-gray.zip<br />
<br />
Feel free to download it and use it.<br />
<br />
<h2>Main getting started steps:</h2><br />
<br />
<ol><br />
<li>Download the CSS version of bootstrap at: http://getbootstrap.com/</li><br />
(that is, not the Less or Sass versions. You can use Less or Sass, but this guide covers using the CSS version for now)<br />
<li>Put the zip in your template folder. Here’s the path: sohoadmin/program/modules/site_templates/pages/your_template_name. Where "your_template_name" is the folder name that will contain your template. Then extract the zip in there.</li><br />
<li>Add an index.html file. As of this writing, a default index.html doesn’t come with the zip, but Bootstrap’s example templates are here, under “examples”: http://getbootstrap.com/getting-started/</li><br />
<li>If using one of their templates, open one in your browser, view the source and copy and paste it into your index.html file and save it in your template folder. This guide uses the “Jumbotron” template.</li><br />
<li>Add the #relative_template_path# pound variable to any links to Bootstrap’s default stylesheets.</li><br />
<li>Add the pound variables, a custom.css file, and then start making your template.</li><br />
</ol><br />
<br />
<h2>The menu</h2><br />
<br />
The main things the menu needs are certain css classes added to different elements. Copy the pgm-auto_menu.php found inside the zip file at the top of this doc, and paste it into your template folder. We added the required classes to it to make the menu work (like collapse into the “hamburger” icon, and retain all the drop-down menu items).<br />
<br />
Add the #hmains# pound variable into the correct place in index.html for the menu. It’s usually where the template starts building out the menu with unordered list items (i.e. ul’s and li’s).<br />
<br />
<h2>Our index.html and commentary</h2><br />
<br />
If you take a look at the index.html file in our template zip, you'll see we made a few changes. We had to change a few things from the Jumbotron template code that we copied and pasted. Below are the main highlights so you don’t miss anything:<br />
<br />
<ol><br />
<li>At the bottom, the main javascript file link had a path like ../../js/bootstrap.min.js . Remove the ../../ so it’s just js/bootstrap.min.js, or else it won’t be applied. In other words, match the folder structure you have.</li><br />
<li>There is no “jumbotron.css” stylesheet in the get bootstrap download zip, so we just deleted that link in our index.html. Plus we deleted other items that didn't come with the zip file, like the link to a favicon, etc. </li><br />
<li>We commented out any forms that came with the template. Soholaunch lets you drag and drop login and search boxes already in the page editor. But you can still use them if you need to. </li><br />
</ol><br />
<br />
<br />
[[category: Templates ]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Building_a_Foundation_responsive_templateBuilding a Foundation responsive template2015-02-19T19:32:25Z<p>Soho: removed #relative_template_path# from modernizr.js path. It isn't needed for javascript file paths.</p>
<hr />
<div>This is a guide for building responsive templates in Soholaunch. The guide will use the CSS version of the Zurb Foundation 5 framework (as opposed to the Sass version). Most of the process transfers over to other frameworks like Twitter Bootstrap. Here is the complete working template file that the sample code in this wiki comes from: http://site.soholaunch.com/media/Responsive-Elegant-pink.zip . Feel free to download it and use it for reference.<br />
<br />
<h2>1. Download Zurb Foundation at: http://foundation.zurb.com/develop/download.html</h2><br />
<br />
Download either the default CSS or make your own custom CSS package. Either way, it will give you a .zip file to download. Save it to your computer.<br />
<br />
<h2>2. Extract the zip in your project folder</h2><br />
<br />
Go to the template folder in your Soholaunch installation:<br />
/sohoadmin/program/modules/site_templates/pages<br />
<br />
Make a folder for your template. Put the zip file inside of it and extract it. You should have some folders like css/js/img and an index.html file. The folder structure will look sort of like this:<br />
<br />
http://site.soholaunch.com/media/folder-structure-extracted.jpg<br />
<br />
<h2>3. Add the relative template path variable</h2><br />
<br />
Open index.html in your code editor. In the head section, you will have a link to the core foundation.css file. You need to add #relative_template_path# at the beginning of that link so it is applied. It should look something like this:<br />
<pre><br />
<head><br />
<meta charset="utf-8" /><br />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /><br />
<title>#title#</title><br />
<link rel="stylesheet" href="#relative_template_path#/css/foundation.css" /> <!- Must add #relative_template_path# --><br />
<script src="js/vendor/modernizr.js"></script><br />
</head><br />
</pre><br />
<br />
<h2>4. Build and style your template</h2><br />
<br />
Create a custom.css in your template folder. Add your own custom css to it. This is instead of adding it to the foundation.css so things are a little more organized. No need to link custom.css in your html as long as you keep the file name custom.css exactly. (Soholaunch already links it on its own).<br />
<br />
Add the pound variables in your index.html. Put them inside of the column classes of the grid like they are actual content. <br />
<br />
See more about the pound variables at the [[Custom_Templates]] wiki page.<br />
<br />
<h2>More about the menu</h2><br />
<br />
Soholaunch developers have found that responsive frameworks have pesky menus - Foundation included. As a general rule, you usually need to follow the framework’s documentation and sample code very closely, or the menu may not function right.<br />
<br />
Below is a rundown of how the Soholaunch developers have implemented the Foundation 5 menu to use Soholaunch’s menu system. This lets the menu toggle into the “hamburger” / “pancake” icon for mobile devices and retain all drop-down menu items.<br />
<br />
First, we copied the sample menu code from the Foundation Top Bar doc and pasted it into our index.html. Here’s the link to the doc we used:<br />
<br />
http://foundation.zurb.com/docs/components/topbar.html<br />
<br />
There is a point when the sample code begins building out the menu with unordered lists (i.e. ul and li). That is where you should add the Soholaunch menu pound variable instead. To illustrate, here is what our code looks like:<br />
<br />
<pre><br />
<nav class="top-bar" data-topbar data-options="mobile_show_parent_link: true" role="primary"> <!--Begin navigation structure--><br />
<ul class="title-area"><br />
<li class="name"> <br />
<h1></h1> <!--Have to have this to make menu work, even if it's empty --><br />
</li><br />
<li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li><br />
</ul><br />
<section class="top-bar-section"><br />
<div class="nav-bar">#hmains#</div><!--This is where we added hmains instead of the list items--> <br />
</section> <br />
</nav> <!--End of navigation structure--><br />
</pre><br />
<br />
You’ll see we added #hmains# where the sample code builds out the menu links with unordered lists. The hmains pound variable will add those links for you and let you use the Soholaunch menu manager.<br />
<br />
Here's the PHP file we made that turns hmains into list items and applies the drop-down classes that Foundation 5 needs:<br />
<br />
http://site.soholaunch.com/media/pgm-auto_menu.txt<br />
<br />
Copy and paste it into your editor and then save it as a .php file. Then put it in your template folder.<br />
<br />
<strong>Note:</strong> To style the top bar, we had to work off of (fight) the default css classes that Foundation applies to it (use your browser’s code inspector to see what classes are getting applied). Or we added our own classes.<br />
<br />
<h2>Final folder structure (for reference)</h2><br />
<br />
In the end, a bare minimum folder structure will look something like this:<br />
<br />
http://site.soholaunch.com/media/final-folder-structure.jpg<br />
<br />
Here are the things that are different:<br />
<ul><br />
<li>Deleted the original Foundation zip file (don’t need it anymore. Keep it if you want)</li><br />
<li>Deleted robots.txt and humans.txt (these aren’t necessary in the template folder)</li><br />
<li>Added screenshot.jpg, which will show in the Soholaunch template manager</li><br />
</ul><br />
<br />
<h2>Sample index.html file and commentary</h2><br />
<br />
Here you’ll see a sample index.html using the Foundation framework. These are the highlights that the developer did in this sample:<br />
<br />
<ul><br />
<li>Wrapped the main content areas like box1 and content and the footer in their own Foundation column classes i.e. large-12, large-4. This follows the same process recommended by Foundation’s documentation about the grid. Read more about the grid here: http://foundation.zurb.com/docs/components/grid.html</li><br />
<li>Added my own css classes outside of Foundation’s when I needed to, like “box”, and styled them in my custom.css file.</li><br />
<li>Used Ultra’s built-in #jquery# pound variable and added my own custom jQuery scripts (at the bottom). Deleted the jQuery link that comes with the default index.html. You can add jQuery however you prefer.</li><br />
</ul><br />
<br />
<pre><br />
<!doctype html><br />
<html class="no-js" lang="en"><br />
<head><br />
<meta charset="utf-8" /><br />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /><br />
<title>#title#</title><br />
<link rel="stylesheet" href="#relative_template_path#/css/foundation.css" /><br />
<script src="js/vendor/modernizr.js"></script><br />
</head><br />
<body><br />
<div class="wrapper"><br />
<div class="logo-banner"><br />
<h1 class="logo">#logo#-alt#logoimg#</h1><br />
</div><br />
<div class="slogan-banner"><br />
<h2 class="slogan">#slogan#</h2><br />
</div><br />
<section class="bar-nav"><br />
<div class="row"><br />
<div class="large-12 columns"><br />
<nav class="top-bar" data-topbar data-options="mobile_show_parent_link: true" role="primary"><br />
<!--Begin navigation structure--><br />
<ul class="title-area"><br />
<li class="name"><br />
<h1></h1> <br />
<!--Have to have this to make menu work, even if it's empty --><br />
</li><br />
<li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a><br />
</li><br />
</ul><br />
<section class="top-bar-section"><br />
<div class="nav-bar">#hmains#</div><br />
</section><br />
</nav><br />
<!--End of navigation structure--><br />
</div><br />
</div><br />
</section><br />
<div class="row"><br />
<div class="large-8 columns middle"><br />
<div class="row"><br />
<div class="callout panel content"><br />
#content# &nbsp;<br />
<!--Helps keep the sidebar in place--><br />
</div><br />
</div><br />
</div><br />
<div class="large-4 columns"><br />
<div id="box-one" class="panel box"><br />
#BOX1#<br />
</div><br />
</div><br />
<div class="push"></div><br />
</div><br />
</div><br />
<section class="footer"><br />
<div class="row"><br />
<div class="large-12 columns"><br />
#copyright#<br />
</div><br />
</div><br />
</section><br />
#jquery#<br />
<script><br />
/* Remove the slogan div cleanly if it's not in use */<br />
$(function () {<br />
if ($(".slogan").html().length === 0) {<br />
$(".slogan").remove();<br />
}<br />
/* Expand the content area out if the sidebar isn't in use */<br />
if (!$("#box-one").text().trim().length) {<br />
$(".middle").addClass("large-12").removeClass("large-8");<br />
$(".box").remove();<br />
}<br />
});<br />
</script><br />
<script src="js/foundation.min.js"></script><br />
<script><br />
$(document).foundation();<br />
</script><br />
</body><br />
</html><br />
</pre><br />
<br />
[[Category:Templates]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Sohowiki_SandboxSohowiki Sandbox2014-10-22T19:38:08Z<p>Soho: /* Affiliate link test */ commented out affiliate link and heading</p>
<hr />
<div>Write now, organize and place later. This is the place to draft content before you know exactly where it should go...also good place for expermimenting with wiki markup.<br />
<br />
<!--==Affiliate link test==<br />
http://addons.soholaunch.com/?partner=7--><br />
<br />
==Test Main Page layout==<br />
{| width="100%" cellpadding="5" cellspacing="5"<br />
| width="50%" style="font-size: 95%;background-color: #f8f9fd; border: 1px solid #d9e6ef;vertical-align: top;"| <br />
{| style="background-color: #f8f9fd;"<br />
! <h2 style="margin:0;background-color:#a5c6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Welcome</h2><br />
|-<br />
| We've set up this site to act as a central knowledgebase for all things Soholaunch. At this point, the site's still a baby, with only a few scattered pages of content, so if you're just browsing for an answer, solution, etc. to specific question/problem you have, then you'll probably have better luck searching the [[http://forum.soholaunch.com Soholaunch Community Forum]] or even the regular [http://manual.soholaunch.com User's Manual]. And hey, if you do find your answer on the forums, maybe you could come back to this site and write a quick tip/article about it... you could even include a little "this tip/article brought to you by..." blurb with a link to your company website...<br />
|-<br />
|'''Note:''' This is not meant to replace the standard [http://manual.soholaunch.com User's Manual]. We (Soholaunch) created it because we wanted a place to quickly post random/specialized information (i.e. installation troubleshooting, customization tricks, etc) without having to stop and think about private-branding issues or whether it might be so specialized (only relavant to a small minority) that it's existence might end up confusing more people than it helps.<br />
|}<br />
| width="50%" style="background-color: #f8fdfb; border: 1px solid #dff6ea;vertical-align: top;"|<br />
{| width="100%" style="background-color: #f8fdfb;"<br />
!<h2 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Latest Updates</h2><br />
|-<br />
|<br />
*Working changelog started for upcoming v4.9 r21<br />
*New main page for wiki!<br />
*New troubleshooting tip on free trial period<br />
|-<br />
|<h2 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Quick Links</h2><br />
*[[Special:Popularpages|Most popular pages]]<br />
*[[Custom_Templates|Custom template specs]]<br />
|}<br />
|}</div>Sohohttps://wiki.soholaunch.com/index.php?title=Create_PagesCreate Pages2014-10-22T16:57:26Z<p>Soho: commented out image (broken link)</p>
<hr />
<div>== Creating New Site Pages ==<br />
When installed, the Soholaunch Pro Edition automatically creates a Home Page for your site. To create new pages, select “Create New Pages” from the main menu (Page Editing Group). You may create up to 10 pages at a time, and there is no limit on the total number of pages that can be created for your web site.<br />
<br />
If you are using the “Menu Display” navigation system, the names you chose for your pages will be displayed on your menu buttons, and will be viewed by your site visitors.<br />
<br />
Type the desired page name(s) in the Page Name column, and make sure the page type is set to “Menu Page,” as this section is dedicated to normal content pages. The other page types (Newsletter, Event Calendar, and Shopping Cart Attachment) will be discussed in later chapters.<br />
<br />
Page names can only consist of letters, underscores, and/or numbers. Dashes, ampersands and other characters will be filtered out.<br />
<br />
If you do not wish to create 10 pages, simply leave the other page name fields blank. Click the “Create Pages” button to create your new pages. When your pages are created, you will be directed to the Open/Edit Pages Module.<br />
<br />
<!--http://wiki.soholaunch.com/images/product_images/Create_Pages.png--><br />
<br />
==Opening Pages==<br />
Once pages have been created, you can place content on them or edit the content that already exists on the page. To edit a page, click the &#8220;Edit Page&#8221; menu item on the main menu (Page Editing Group) or the &#8220;Edit Page&#8221; button on the top navigation bar (Both serve the same purpose).<br />
<br />
Click on the name of the page you wish to edit. This will start loading the page editor with the page content for your selected page. (Attachment pages are covered in later module sections)</div>Sohohttps://wiki.soholaunch.com/index.php?title=Template_ManagerTemplate Manager2014-10-22T16:49:43Z<p>Soho: comment out settings picture</p>
<hr />
<div>Graphical themes, or templates, are managed through the Template Manager Module, which is accessed by clicking on Template Manager from the Main Menu.<br />
<br />
<!--[[Image:Template_Manager.jpg|thumb|Template Manager]]--><br />
<br />
==Template Manager Main Menu ==<br />
<br />
===Using Pre-Installed Templates===<br />
To use a pre-installed or custom template for your website, select it from the Base Site Templates drop-down box and click on the &#8220;Change Template(s)&#8221; button.<br />
<br />
===Template Builder===<br />
To access the Website Builder's Site Template Builder, click on the Template Builder button located at the upper right of the Template Manager Module. <br />
<br />
All templates built using the Site Templates Builder will be available for use in the Template Manager Module, and behave exactly like custom templates -- namely because they are custom templates. At any point during your Template creation process, you may preview your current configuration by clicking on the Preview Design button. <br />
<br />
;Template Name<br />
:Once saved, your template(s) will appear in the Base Site Templates drop-down box in the Template Manager Module, listed as the Template Name. <br />
;Template Image<br />
:All templates created through the Site Template Manager incorporate a single image. Any images uploaded through the File Upload Module will be available in the Template Image drop-down box.<br />
;Template Style<br />
:Select which of the five layouts you would like to use for your site. Nearly all websites in existence are based upon variations of these Template Styles.<br />
;Foreground Color<br />
:Unless you are using the &#8220;Blank&#8221; Template Style, the color you select from the Foreground Color drop-down box will determine the color of your Template Style, or shape. This is represented in the Template Style example pictures by the black area. <br />
;Title Color<br />
:The color you select from the Title Color drop-down box will determine the color of your Built-In Template Header (discussed earlier in this chapter).<br />
;Link Color<br />
:By default, all templates created with the Site Template Builder will include a text-based menu system. The color you select from the Link Color drop-down box will determine the color of these text links.<br />
;Background Color<br />
:The color you select from the Background Color drop-down box will dictate the Background Color of your content area. Essentially, this is the color that will appear behind the text content on your website.<br />
;Text Color<br />
:The color that you select form the Text Color drop-down box will determine the default color of the text content on your website. Regardless of which color you select, you can change the color of your text content manually through the Text Editor (See Chapter 8 for more information).<br />
;Hex Values<br />
:This optional feature, which appears next to each of the color definitions, is available so that advanced users can specify the exact color value they would like to use. If you are not familiar with hex color values, just ignore them.<br />
<br />
When you are satisfied with your design, click on the Save Design button to save your new template. To use your new template with your website, select it from the Base Site Template drop-down box in the Template Manager Module, and click on the Change Template button. You may also assign your new template to individual pages by using Multiple Template Definitions (discussed earlier in this chapter).<br />
<br />
==Settings==<br />
The settings tab is the place where you can manage elements of your site that visitors will see. You can manage your user-swappable images, update your logo and slogan text and your logo image. You can also update your business information. <br />
<br />
<!--[[Image:Settings.jpg|thumb|Template Settings]]--><br />
<br />
==Template Boxes==<br />
For a primer on using template boxes in Soholaunch, please visit the [[Template_Boxes]] page. <br />
<br />
==Advanced Coding Techniques==<br />
When using custom navigation elements, you will need to know how to code various links. Since the entire site created within the product platform is database-driven, it is necessary to call pages differently than when coding for traditional HTML pages. Theses links must be added inside the template file.<br />
<br />
===Normal Page Links===<br />
<br />
Let&#8217;s say that you have created a navigation button that should be linked to the &#8220;About Us&#8221; Page. The following code is what should be used to link your navigation element: index.php?pr=About_Us<br />
<br />
This code is case sensitive and must be accurately depicted for proper operation. Notice that all spaces between words in the page names are separated by an underscore. This must be manually coded in place of spaces for the link to work properly. <br />
<br />
The actual page name is directly related to the page name created within the &#8220;Create Pages&#8221; module of the Soholaunch Website Builder. Notice also that the first letter of each word in the page name is capitalized. No matter what you type within the create pages module (you must create the pages within the system even if utilizing custom navigation), the system will automatically capitalize the first letter of each word in a page name and it can only be 22 characters long. Therefore, you must also keep this in mind when coding the custom link. If you are coding before creating pages within the tool, keep the page names fewer than 22 characters in length. <br />
<br />
NOTE: Because your site is database driven, you will always call the &#8220;index.php&#8221; file when linking to normal site pages.<br />
<br />
===More Info===<br />
For more information on custom templates, please visit the [[Custom_Templates]] page.</div>Sohohttps://wiki.soholaunch.com/index.php?title=Template_ManagerTemplate Manager2014-10-22T16:48:42Z<p>Soho: commented out image and fixed a little spelling</p>
<hr />
<div>Graphical themes, or templates, are managed through the Template Manager Module, which is accessed by clicking on Template Manager from the Main Menu.<br />
<br />
<!--[[Image:Template_Manager.jpg|thumb|Template Manager]]--><br />
<br />
==Template Manager Main Menu ==<br />
<br />
===Using Pre-Installed Templates===<br />
To use a pre-installed or custom template for your website, select it from the Base Site Templates drop-down box and click on the &#8220;Change Template(s)&#8221; button.<br />
<br />
===Template Builder===<br />
To access the Website Builder's Site Template Builder, click on the Template Builder button located at the upper right of the Template Manager Module. <br />
<br />
All templates built using the Site Templates Builder will be available for use in the Template Manager Module, and behave exactly like custom templates -- namely because they are custom templates. At any point during your Template creation process, you may preview your current configuration by clicking on the Preview Design button. <br />
<br />
;Template Name<br />
:Once saved, your template(s) will appear in the Base Site Templates drop-down box in the Template Manager Module, listed as the Template Name. <br />
;Template Image<br />
:All templates created through the Site Template Manager incorporate a single image. Any images uploaded through the File Upload Module will be available in the Template Image drop-down box.<br />
;Template Style<br />
:Select which of the five layouts you would like to use for your site. Nearly all websites in existence are based upon variations of these Template Styles.<br />
;Foreground Color<br />
:Unless you are using the &#8220;Blank&#8221; Template Style, the color you select from the Foreground Color drop-down box will determine the color of your Template Style, or shape. This is represented in the Template Style example pictures by the black area. <br />
;Title Color<br />
:The color you select from the Title Color drop-down box will determine the color of your Built-In Template Header (discussed earlier in this chapter).<br />
;Link Color<br />
:By default, all templates created with the Site Template Builder will include a text-based menu system. The color you select from the Link Color drop-down box will determine the color of these text links.<br />
;Background Color<br />
:The color you select from the Background Color drop-down box will dictate the Background Color of your content area. Essentially, this is the color that will appear behind the text content on your website.<br />
;Text Color<br />
:The color that you select form the Text Color drop-down box will determine the default color of the text content on your website. Regardless of which color you select, you can change the color of your text content manually through the Text Editor (See Chapter 8 for more information).<br />
;Hex Values<br />
:This optional feature, which appears next to each of the color definitions, is available so that advanced users can specify the exact color value they would like to use. If you are not familiar with hex color values, just ignore them.<br />
<br />
When you are satisfied with your design, click on the Save Design button to save your new template. To use your new template with your website, select it from the Base Site Template drop-down box in the Template Manager Module, and click on the Change Template button. You may also assign your new template to individual pages by using Multiple Template Definitions (discussed earlier in this chapter).<br />
<br />
==Settings==<br />
The settings tab is the place where you can manage elements of your site that visitors will see. You can manage your user-swappable images, update your logo and slogan text and your logo image. You can also update your business information. <br />
<br />
[[Image:Settings.jpg|thumb|Template Settings]]<br />
<br />
==Template Boxes==<br />
For a primer on using template boxes in Soholaunch, please visit the [[Template_Boxes]] page. <br />
<br />
==Advanced Coding Techniques==<br />
When using custom navigation elements, you will need to know how to code various links. Since the entire site created within the product platform is database-driven, it is necessary to call pages differently than when coding for traditional HTML pages. Theses links must be added inside the template file.<br />
<br />
===Normal Page Links===<br />
<br />
Let&#8217;s say that you have created a navigation button that should be linked to the &#8220;About Us&#8221; Page. The following code is what should be used to link your navigation element: index.php?pr=About_Us<br />
<br />
This code is case sensitive and must be accurately depicted for proper operation. Notice that all spaces between words in the page names are separated by an underscore. This must be manually coded in place of spaces for the link to work properly. <br />
<br />
The actual page name is directly related to the page name created within the &#8220;Create Pages&#8221; module of the Soholaunch Website Builder. Notice also that the first letter of each word in the page name is capitalized. No matter what you type within the create pages module (you must create the pages within the system even if utilizing custom navigation), the system will automatically capitalize the first letter of each word in a page name and it can only be 22 characters long. Therefore, you must also keep this in mind when coding the custom link. If you are coding before creating pages within the tool, keep the page names fewer than 22 characters in length. <br />
<br />
NOTE: Because your site is database driven, you will always call the &#8220;index.php&#8221; file when linking to normal site pages.<br />
<br />
===More Info===<br />
For more information on custom templates, please visit the [[Custom_Templates]] page.</div>Sohohttps://wiki.soholaunch.com/index.php?title=10_Packs10 Packs2014-10-22T16:34:34Z<p>Soho: updated the license pricing and math</p>
<hr />
<div>==What is a 10 Pack?==<br />
A 10 Pack, as its name implies, adds 10 Single Website Licenses to your Soholaunch partner account inventory that you can use whenever you want (i.e., you do not have to assign them to particular domain names right away).<br />
<br />
==Who are they for?==<br />
If you use Soholaunch Pro Edition to build websites for yourself and/or your clients and you prefer the Single Website License method over ProServer licensing method — e.g., because you don't always host the sites on the same server or because you'd rather pay a one-time charge than a recurring monthly fee — then buying a 10 Pack could more an extremely cost-effective and convenient option for you.<br />
<br />
==How much can I save?==<br />
If you purchased 10 Single Website Licenses one-by-one at the current retail price of $18/each/month it would cost you $180, but a 10 pack only costs $90 (at of the time this article was written...October 2014), so you save $90.00. <br />
<br />
==Where/How do I purchase a 10 Pack?==<br />
You can purchase 10 packs (and 5 packs) from the [http://billing.soholaunch.com/cart.php Pro Edition purchase page]<br />
<br />
If you are already a Soholaunch customer, you can purchase the pack from your Partner Area account.<br />
<br />
#Log-in to the [http://partner.soholaunch.com Soholaunch Partner Area]. <br />
#At the top of the Account Settings page in the Partner Area you should see a button that says "Buy Single Website License(s)". Click that. <br />
#On the next page you'll see the option to purchase the 10 Pack, under the "Choose License Package" heading.</div>Sohohttps://wiki.soholaunch.com/index.php?title=10_Packs10 Packs2014-10-22T16:30:28Z<p>Soho: updated that customers can purchase the packs from the checkout page and don't need to contact Soholaunch for them</p>
<hr />
<div>==What is a 10 Pack?==<br />
A 10 Pack, as its name implies, adds 10 Single Website Licenses to your Soholaunch partner account inventory that you can use whenever you want (i.e., you do not have to assign them to particular domain names right away).<br />
<br />
==Who are they for?==<br />
If you use Soholaunch Pro Edition to build websites for yourself and/or your clients and you prefer the Single Website License method over ProServer licensing method — e.g., because you don't always host the sites on the same server or because you'd rather pay a one-time charge than a recurring monthly fee — then buying a 10 Pack could more an extremely cost-effective and convenient option for you.<br />
<br />
==How much can I save?==<br />
If you purchased 10 Single Website Licenses one-by-one at the current retail price of $99/each it would cost you $990, but a 10 pack only costs $600 (at of the time this article was written...May 2007), so you save $390.00. <br />
<br />
==Where/How do I purchase a 10 Pack?==<br />
You can purchase 10 packs (and 5 packs) from the [http://billing.soholaunch.com/cart.php Pro Edition purchase page]<br />
<br />
If you are already a Soholaunch customer, you can purchase the pack from your Partner Area account.<br />
<br />
#Log-in to the [http://partner.soholaunch.com Soholaunch Partner Area]. <br />
#At the top of the Account Settings page in the Partner Area you should see a button that says "Buy Single Website License(s)". Click that. <br />
#On the next page you'll see the option to purchase the 10 Pack, under the "Choose License Package" heading.</div>Sohohttps://wiki.soholaunch.com/index.php?title=Category:PluginsCategory:Plugins2014-10-22T16:16:36Z<p>Soho: added that Ultra can run plugins</p>
<hr />
<div>Plugins are installable packages that add new functionality to Soholaunch Pro Editon and Soholaunch Ultra. They can add anything from a toolbar button to a entirely new feature feature module.<br />
<br />
Above all, plugins let you tailor your Soholaunch installation to suit your specific purposes; adding only the features you want and leaving out those you don't.</div>Sohohttps://wiki.soholaunch.com/index.php?title=Building_a_Foundation_responsive_templateBuilding a Foundation responsive template2014-10-22T14:57:29Z<p>Soho: beatified the bottom html markup</p>
<hr />
<div>This is a guide for building responsive templates in Soholaunch. The guide will use the CSS version of the Zurb Foundation 5 framework (as opposed to the Sass version). Most of the process transfers over to other frameworks like Twitter Bootstrap. Here is the complete working template file that the sample code in this wiki comes from: http://site.soholaunch.com/media/Responsive-Elegant-pink.zip . Feel free to download it and use it for reference.<br />
<br />
<h2>1. Download Zurb Foundation at: http://foundation.zurb.com/develop/download.html</h2><br />
<br />
Download either the default CSS or make your own custom CSS package. Either way, it will give you a .zip file to download. Save it to your computer.<br />
<br />
<h2>2. Extract the zip in your project folder</h2><br />
<br />
Go to the template folder in your Soholaunch installation:<br />
/sohoadmin/program/modules/site_templates/pages<br />
<br />
Make a folder for your template. Put the zip file inside of it and extract it. You should have some folders like css/js/img and an index.html file. The folder structure will look sort of like this:<br />
<br />
http://site.soholaunch.com/media/folder-structure-extracted.jpg<br />
<br />
<h2>3. Add the relative template path variable</h2><br />
<br />
Open index.html in your code editor. In the head section, you will have a link to the core foundation.css file. You need to add #relative_template_path# at the beginning of that link so it is applied. It should look something like this:<br />
<pre><br />
<head><br />
<meta charset="utf-8" /><br />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /><br />
<title>#title#</title><br />
<link rel="stylesheet" href="#relative_template_path#/css/foundation.css" /> <!- Must add #relative_template_path# --><br />
<script src="js/vendor/modernizr.js"></script><br />
</head><br />
</pre><br />
<br />
<h2>4. Build and style your template</h2><br />
<br />
Create a custom.css in your template folder. Add your own custom css to it. This is instead of adding it to the foundation.css so things are a little more organized. No need to link custom.css in your html as long as you keep the file name custom.css exactly. (Soholaunch already links it on its own).<br />
<br />
Add the pound variables in your index.html. Put them inside of the column classes of the grid like they are actual content. <br />
<br />
See more about the pound variables at the [[Custom_Templates]] wiki page.<br />
<br />
<h2>More about the menu</h2><br />
<br />
Soholaunch developers have found that responsive frameworks have pesky menus - Foundation included. As a general rule, you usually need to follow the framework’s documentation and sample code very closely, or the menu may not function right.<br />
<br />
Below is a rundown of how the Soholaunch developers have implemented the Foundation 5 menu to use Soholaunch’s menu system. This lets the menu toggle into the “hamburger” / “pancake” icon for mobile devices and retain all drop-down menu items.<br />
<br />
First, we copied the sample menu code from the Foundation Top Bar doc and pasted it into our index.html. Here’s the link to the doc we used:<br />
<br />
http://foundation.zurb.com/docs/components/topbar.html<br />
<br />
There is a point when the sample code begins building out the menu with unordered lists (i.e. ul and li). That is where you should add the Soholaunch menu pound variable instead. To illustrate, here is what our code looks like:<br />
<br />
<pre><br />
<nav class="top-bar" data-topbar data-options="mobile_show_parent_link: true" role="primary"> <!--Begin navigation structure--><br />
<ul class="title-area"><br />
<li class="name"> <br />
<h1></h1> <!--Have to have this to make menu work, even if it's empty --><br />
</li><br />
<li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li><br />
</ul><br />
<section class="top-bar-section"><br />
<div class="nav-bar">#hmains#</div><!--This is where we added hmains instead of the list items--> <br />
</section> <br />
</nav> <!--End of navigation structure--><br />
</pre><br />
<br />
You’ll see we added #hmains# where the sample code builds out the menu links with unordered lists. The hmains pound variable will add those links for you and let you use the Soholaunch menu manager.<br />
<br />
Here's the PHP file we made that turns hmains into list items and applies the drop-down classes that Foundation 5 needs:<br />
<br />
http://site.soholaunch.com/media/pgm-auto_menu.txt<br />
<br />
Copy and paste it into your editor and then save it as a .php file. Then put it in your template folder.<br />
<br />
<strong>Note:</strong> To style the top bar, we had to work off of (fight) the default css classes that Foundation applies to it (use your browser’s code inspector to see what classes are getting applied). Or we added our own classes.<br />
<br />
<h2>Final folder structure (for reference)</h2><br />
<br />
In the end, a bare minimum folder structure will look something like this:<br />
<br />
http://site.soholaunch.com/media/final-folder-structure.jpg<br />
<br />
Here are the things that are different:<br />
<ul><br />
<li>Deleted the original Foundation zip file (don’t need it anymore. Keep it if you want)</li><br />
<li>Deleted robots.txt and humans.txt (these aren’t necessary in the template folder)</li><br />
<li>Added screenshot.jpg, which will show in the Soholaunch template manager</li><br />
</ul><br />
<br />
<h2>Sample index.html file and commentary</h2><br />
<br />
Here you’ll see a sample index.html using the Foundation framework. These are the highlights that the developer did in this sample:<br />
<br />
<ul><br />
<li>Wrapped the main content areas like box1 and content and the footer in their own Foundation column classes i.e. large-12, large-4. This follows the same process recommended by Foundation’s documentation about the grid. Read more about the grid here: http://foundation.zurb.com/docs/components/grid.html</li><br />
<li>Added my own css classes outside of Foundation’s when I needed to, like “box”, and styled them in my custom.css file.</li><br />
<li>Used Ultra’s built-in #jquery# pound variable and added my own custom jQuery scripts (at the bottom). Deleted the jQuery link that comes with the default index.html. You can add jQuery however you prefer.</li><br />
</ul><br />
<br />
<pre><br />
<!doctype html><br />
<html class="no-js" lang="en"><br />
<head><br />
<meta charset="utf-8" /><br />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /><br />
<title>#title#</title><br />
<link rel="stylesheet" href="#relative_template_path#/css/foundation.css" /><br />
<script src="#relative_template_path#/js/vendor/modernizr.js"></script><br />
</head><br />
<body><br />
<div class="wrapper"><br />
<div class="logo-banner"><br />
<h1 class="logo">#logo#-alt#logoimg#</h1><br />
</div><br />
<div class="slogan-banner"><br />
<h2 class="slogan">#slogan#</h2><br />
</div><br />
<section class="bar-nav"><br />
<div class="row"><br />
<div class="large-12 columns"><br />
<nav class="top-bar" data-topbar data-options="mobile_show_parent_link: true" role="primary"><br />
<!--Begin navigation structure--><br />
<ul class="title-area"><br />
<li class="name"><br />
<h1></h1> <br />
<!--Have to have this to make menu work, even if it's empty --><br />
</li><br />
<li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a><br />
</li><br />
</ul><br />
<section class="top-bar-section"><br />
<div class="nav-bar">#hmains#</div><br />
</section><br />
</nav><br />
<!--End of navigation structure--><br />
</div><br />
</div><br />
</section><br />
<div class="row"><br />
<div class="large-8 columns middle"><br />
<div class="row"><br />
<div class="callout panel content"><br />
#content# &nbsp;<br />
<!--Helps keep the sidebar in place--><br />
</div><br />
</div><br />
</div><br />
<div class="large-4 columns"><br />
<div id="box-one" class="panel box"><br />
#BOX1#<br />
</div><br />
</div><br />
<div class="push"></div><br />
</div><br />
</div><br />
<section class="footer"><br />
<div class="row"><br />
<div class="large-12 columns"><br />
#copyright#<br />
</div><br />
</div><br />
</section><br />
#jquery#<br />
<script><br />
/* Remove the slogan div cleanly if it's not in use */<br />
$(function () {<br />
if ($(".slogan").html().length === 0) {<br />
$(".slogan").remove();<br />
}<br />
/* Expand the content area out if the sidebar isn't in use */<br />
if (!$("#box-one").text().trim().length) {<br />
$(".middle").addClass("large-12").removeClass("large-8");<br />
$(".box").remove();<br />
}<br />
});<br />
</script><br />
<script src="js/foundation.min.js"></script><br />
<script><br />
$(document).foundation();<br />
</script><br />
</body><br />
</html><br />
</pre><br />
<br />
[[Category:Templates]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Building_a_Twitter_Bootstrap_templateBuilding a Twitter Bootstrap template2014-06-23T13:06:50Z<p>Soho: Protected "Building a Twitter Bootstrap template" ([edit=sysop] (indefinite) [move=sysop] (indefinite))</p>
<hr />
<div>The following is a guide for creating a Soholaunch template with Twitter Bootstrap.<br />
<br />
Here’s the complete working template file that this guide uses: http://site.soholaunch.com/media/bootstrap-basic-gray.zip<br />
<br />
Feel free to download it and use it.<br />
<br />
<h2>Main getting started steps:</h2><br />
<br />
<ol><br />
<li>Download the CSS version of bootstrap at: http://getbootstrap.com/</li><br />
(that is, not the Less or Sass versions. You can use Less or Sass, but this guide covers using the CSS version for now)<br />
<li>Put the zip in your template folder. Here’s the path: sohoadmin/program/modules/site_templates/pages/your_template_name. Where "your_template_name" is the folder name that will contain your template. Then extract the zip in there.</li><br />
<li>Add an index.html file. As of this writing, a default index.html doesn’t come with the zip, but Bootstrap’s example templates are here, under “examples”: http://getbootstrap.com/getting-started/</li><br />
<li>If using one of their templates, open one in your browser, view the source and copy and paste it into your index.html file and save it in your template folder. This guide uses the “Jumbotron” template.</li><br />
<li>Add the #relative_template_path# pound variable to any links to Bootstrap’s default stylesheets.</li><br />
<li>Add the pound variables, a custom.css file, and then start making your template.</li><br />
</ol><br />
<br />
<h2>The menu</h2><br />
<br />
The main things the menu needs are certain css classes added to different elements. Copy the pgm-auto_menu.php found inside the zip file at the top of this doc, and paste it into your template folder. We added the required classes to it to make the menu work (like collapse into the “hamburger” icon, and retain all the drop-down menu items).<br />
<br />
Add the #hmains# pound variable into the correct place in index.html for the menu. It’s usually where the template starts building out the menu with unordered list items (i.e. ul’s and li’s).<br />
<br />
<h2>Our index.html and commentary</h2><br />
<br />
If you take a look at the index.html file in our template zip, you'll see we made a few changes. We had to change a few things from the Jumbotron template code that we copied and pasted. Below are the main highlights so you don’t miss anything:<br />
<br />
<ol><br />
<li>At the bottom, the main javascript file link had a path like ../../js/bootstrap.min.js . Remove the ../../ so it’s just js/bootstrap.min.js, or else it won’t be applied.</li><br />
<li>There is no “jumbotron.css” stylesheet in the default download zip, so we just deleted that link in our index.html and it didn’t seem to matter.</li><br />
<li>We commented out any forms that came with the template. Soholaunch lets you drag and drop login and search boxes already in the page editor.</li><br />
</ol><br />
<br />
<br />
[[category: Templates ]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Building_a_Foundation_responsive_templateBuilding a Foundation responsive template2014-06-23T13:05:40Z<p>Soho: Protected "Building a Foundation responsive template" ([edit=sysop] (indefinite) [move=sysop] (indefinite))</p>
<hr />
<div>This is a guide for building responsive templates in Soholaunch. The guide will use the CSS version of the Zurb Foundation 5 framework (as opposed to the Sass version). Most of the process transfers over to other frameworks like Twitter Bootstrap. Here is the complete working template file that the sample code in this wiki comes from: http://site.soholaunch.com/media/Responsive-Elegant-pink.zip . Feel free to download it and use it for reference.<br />
<br />
<h2>1. Download Zurb Foundation at: http://foundation.zurb.com/develop/download.html</h2><br />
<br />
Download either the default CSS or make your own custom CSS package. Either way, it will give you a .zip file to download. Save it to your computer.<br />
<br />
<h2>2. Extract the zip in your project folder</h2><br />
<br />
Go to the template folder in your Soholaunch installation:<br />
/sohoadmin/program/modules/site_templates/pages<br />
<br />
Make a folder for your template. Put the zip file inside of it and extract it. You should have some folders like css/js/img and an index.html file. The folder structure will look sort of like this:<br />
<br />
http://site.soholaunch.com/media/folder-structure-extracted.jpg<br />
<br />
<h2>3. Add the relative template path variable</h2><br />
<br />
Open index.html in your code editor. In the head section, you will have a link to the core foundation.css file. You need to add #relative_template_path# at the beginning of that link so it is applied. It should look something like this:<br />
<pre><br />
<head><br />
<meta charset="utf-8" /><br />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /><br />
<title>#title#</title><br />
<link rel="stylesheet" href="#relative_template_path#/css/foundation.css" /> <!- Must add #relative_template_path# --><br />
<script src="js/vendor/modernizr.js"></script><br />
</head><br />
</pre><br />
<br />
<h2>4. Build and style your template</h2><br />
<br />
Create a custom.css in your template folder. Add your own custom css to it. This is instead of adding it to the foundation.css so things are a little more organized. No need to link custom.css in your html as long as you keep the file name custom.css exactly. (Soholaunch already links it on its own).<br />
<br />
Add the pound variables in your index.html. Put them inside of the column classes of the grid like they are actual content. <br />
<br />
See more about the pound variables at the [[Custom_Templates]] wiki page.<br />
<br />
<h2>More about the menu</h2><br />
<br />
Soholaunch developers have found that responsive frameworks have pesky menus - Foundation included. As a general rule, you usually need to follow the framework’s documentation and sample code very closely, or the menu may not function right.<br />
<br />
Below is a rundown of how the Soholaunch developers have implemented the Foundation 5 menu to use Soholaunch’s menu system. This lets the menu toggle into the “hamburger” / “pancake” icon for mobile devices and retain all drop-down menu items.<br />
<br />
First, we copied the sample menu code from the Foundation Top Bar doc and pasted it into our index.html. Here’s the link to the doc we used:<br />
<br />
http://foundation.zurb.com/docs/components/topbar.html<br />
<br />
There is a point when the sample code begins building out the menu with unordered lists (i.e. ul and li). That is where you should add the Soholaunch menu pound variable instead. To illustrate, here is what our code looks like:<br />
<br />
<pre><br />
<nav class="top-bar" data-topbar data-options="mobile_show_parent_link: true" role="primary"> <!--Begin navigation structure--><br />
<ul class="title-area"><br />
<li class="name"> <br />
<h1></h1> <!--Have to have this to make menu work, even if it's empty --><br />
</li><br />
<li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li><br />
</ul><br />
<section class="top-bar-section"><br />
<div class="nav-bar">#hmains#</div><!--This is where we added hmains instead of the list items--> <br />
</section> <br />
</nav> <!--End of navigation structure--><br />
</pre><br />
<br />
You’ll see we added #hmains# where the sample code builds out the menu links with unordered lists. The hmains pound variable will add those links for you and let you use the Soholaunch menu manager.<br />
<br />
Here's the PHP file we made that turns hmains into list items and applies the drop-down classes that Foundation 5 needs:<br />
<br />
http://site.soholaunch.com/media/pgm-auto_menu.txt<br />
<br />
Copy and paste it into your editor and then save it as a .php file. Then put it in your template folder.<br />
<br />
<strong>Note:</strong> To style the top bar, we had to work off of (fight) the default css classes that Foundation applies to it (use your browser’s code inspector to see what classes are getting applied). Or we added our own classes.<br />
<br />
<h2>Final folder structure (for reference)</h2><br />
<br />
In the end, a bare minimum folder structure will look something like this:<br />
<br />
http://site.soholaunch.com/media/final-folder-structure.jpg<br />
<br />
Here are the things that are different:<br />
<ul><br />
<li>Deleted the original Foundation zip file (don’t need it anymore. Keep it if you want)</li><br />
<li>Deleted robots.txt and humans.txt (these aren’t necessary in the template folder)</li><br />
<li>Added screenshot.jpg, which will show in the Soholaunch template manager</li><br />
</ul><br />
<br />
<h2>Sample index.html file and commentary</h2><br />
<br />
Here you’ll see a sample index.html using the Foundation framework. These are the highlights that the developer did in this sample:<br />
<br />
<ul><br />
<li>Wrapped the main content areas like box1 and content and the footer in their own Foundation column classes i.e. large-12, large-4. This follows the same process recommended by Foundation’s documentation about the grid. Read more about the grid here: http://foundation.zurb.com/docs/components/grid.html</li><br />
<li>Added my own css classes outside of Foundation’s when I needed to, like “box”, and styled them in my custom.css file.</li><br />
<li>Used Ultra’s built-in #jquery# pound variable and added my own custom jQuery scripts (at the bottom). Deleted the jQuery link that comes with the default index.html. You can add jQuery however you prefer.</li><br />
</ul><br />
<br />
<pre><br />
<!doctype html><br />
<html class="no-js" lang="en"><br />
<head><br />
<meta charset="utf-8" /><br />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /><br />
<title>#title#</title><br />
<link rel="stylesheet" href="#relative_template_path#/css/foundation.css" /><br />
<script src="#relative_template_path#/js/vendor/modernizr.js"></script><br />
</head><br />
<body><br />
<div class="wrapper"><br />
<div class="logo-banner"><br />
<h1 class="logo">#logo#-alt#logoimg#</h1><br />
</div> <br />
<div class="slogan-banner"><br />
<h2 class="slogan">#slogan#</h2><br />
</div><br />
<section class="bar-nav"><br />
<div class="row"> <br />
<div class="large-12 columns"> <br />
<nav class="top-bar" data-topbar data-options="mobile_show_parent_link: true" role="primary"> <!--Begin navigation structure--><br />
<ul class="title-area"><br />
<li class="name"> <br />
<h1></h1> <!--Have to have this to make menu work, even if it's empty --><br />
</li><br />
<li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li><br />
</ul><br />
<section class="top-bar-section"><br />
<div class="nav-bar">#hmains#</div> <br />
</section> <br />
</nav> <!--End of navigation structure--><br />
</div> <br />
</div> <br />
</section> <br />
<div class="row"><br />
<div class="large-8 columns middle"><br />
<div class="row"><br />
<div class="callout panel content"><br />
#content#<br />
&nbsp; <!--Helps keep the sidebar in place--><br />
</div><br />
</div><br />
</div> <br />
<div class="large-4 columns"> <br />
<div id="box-one" class="panel box"><br />
#BOX1# <br />
</div><br />
</div><br />
<div class="push"></div><br />
</div><br />
</div><br />
<section class="footer"><br />
<div class="row"><br />
<div class="large-12 columns"><br />
#copyright# <br />
</div><br />
</div><br />
</section> <br />
#jquery#<br />
<script><br />
/* Remove the slogan div cleanly if it's not in use */<br />
$(function () {<br />
if($(".slogan").html().length === 0) {<br />
$(".slogan").remove();<br />
}<br />
/* Expand the content area out if the sidebar isn't in use */<br />
if (!$("#box-one").text().trim().length){<br />
$(".middle").addClass("large-12").removeClass("large-8");<br />
$(".box").remove();<br />
}<br />
});<br />
</script><br />
<script src="js/foundation.min.js"></script><br />
<script><br />
$(document).foundation();<br />
</script><br />
</body><br />
</html><br />
</pre><br />
<br />
[[Category:Templates]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Building_a_Twitter_Bootstrap_templateBuilding a Twitter Bootstrap template2014-04-14T19:57:21Z<p>Soho: </p>
<hr />
<div>The following is a guide for creating a Soholaunch template with Twitter Bootstrap.<br />
<br />
Here’s the complete working template file that this guide uses: http://site.soholaunch.com/media/bootstrap-basic-gray.zip<br />
<br />
Feel free to download it and use it.<br />
<br />
<h2>Main getting started steps:</h2><br />
<br />
<ol><br />
<li>Download the CSS version of bootstrap at: http://getbootstrap.com/</li><br />
(that is, not the Less or Sass versions. You can use Less or Sass, but this guide covers using the CSS version for now)<br />
<li>Put the zip in your template folder. Here’s the path: sohoadmin/program/modules/site_templates/pages/your_template_name. Where "your_template_name" is the folder name that will contain your template. Then extract the zip in there.</li><br />
<li>Add an index.html file. As of this writing, a default index.html doesn’t come with the zip, but Bootstrap’s example templates are here, under “examples”: http://getbootstrap.com/getting-started/</li><br />
<li>If using one of their templates, open one in your browser, view the source and copy and paste it into your index.html file and save it in your template folder. This guide uses the “Jumbotron” template.</li><br />
<li>Add the #relative_template_path# pound variable to any links to Bootstrap’s default stylesheets.</li><br />
<li>Add the pound variables, a custom.css file, and then start making your template.</li><br />
</ol><br />
<br />
<h2>The menu</h2><br />
<br />
The main things the menu needs are certain css classes added to different elements. Copy the pgm-auto_menu.php found inside the zip file at the top of this doc, and paste it into your template folder. We added the required classes to it to make the menu work (like collapse into the “hamburger” icon, and retain all the drop-down menu items).<br />
<br />
Add the #hmains# pound variable into the correct place in index.html for the menu. It’s usually where the template starts building out the menu with unordered list items (i.e. ul’s and li’s).<br />
<br />
<h2>Our index.html and commentary</h2><br />
<br />
If you take a look at the index.html file in our template zip, you'll see we made a few changes. We had to change a few things from the Jumbotron template code that we copied and pasted. Below are the main highlights so you don’t miss anything:<br />
<br />
<ol><br />
<li>At the bottom, the main javascript file link had a path like ../../js/bootstrap.min.js . Remove the ../../ so it’s just js/bootstrap.min.js, or else it won’t be applied.</li><br />
<li>There is no “jumbotron.css” stylesheet in the default download zip, so we just deleted that link in our index.html and it didn’t seem to matter.</li><br />
<li>We commented out any forms that came with the template. Soholaunch lets you drag and drop login and search boxes already in the page editor.</li><br />
</ol><br />
<br />
<br />
[[category: Templates ]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Building_a_Twitter_Bootstrap_templateBuilding a Twitter Bootstrap template2014-04-14T19:55:30Z<p>Soho: made the template path clearer and added "be" for right grammar</p>
<hr />
<div>The following is a guide for creating a Soholaunch template with Twitter Bootstrap.<br />
<br />
Here’s the complete working template file that this guide uses: http://site.soholaunch.com/media/bootstrap-basic-gray.zip<br />
<br />
Feel free to download it and use it.<br />
<br />
<h2>Main getting started steps:</h2><br />
<br />
<ol><br />
<li>Download the CSS version of bootstrap at: http://getbootstrap.com/</li><br />
(that is, not the Less or Sass versions. You can use Less or Sass, but this guide covers using the CSS version for now)<br />
<li>Put the zip in your template folder. Here’s the path: sohoadmin/program/modules/site_templates/pages/your_template_name. Where "your_template_name" is the folder name that contains your template. Then extract the zip in there.</li><br />
<li>Add an index.html file. As of this writing, a default index.html doesn’t come with the zip, but Bootstrap’s example templates are here, under “examples”: http://getbootstrap.com/getting-started/</li><br />
<li>If using one of their templates, open one in your browser, view the source and copy and paste it into your index.html file and save it in your template folder. This guide uses the “Jumbotron” template.</li><br />
<li>Add the #relative_template_path# pound variable to any links to Bootstrap’s default stylesheets.</li><br />
<li>Add the pound variables, a custom.css file, and then start making your template.</li><br />
</ol><br />
<br />
<h2>The menu</h2><br />
<br />
The main things the menu needs are certain css classes added to different elements. Copy the pgm-auto_menu.php found inside the zip file at the top of this doc, and paste it into your template folder. We added the required classes to it to make the menu work (like collapse into the “hamburger” icon, and retain all the drop-down menu items).<br />
<br />
Add the #hmains# pound variable into the correct place in index.html for the menu. It’s usually where the template starts building out the menu with unordered list items (i.e. ul’s and li’s).<br />
<br />
<h2>Our index.html and commentary</h2><br />
<br />
If you take a look at the index.html file in our template zip, you'll see we made a few changes. We had to change a few things from the Jumbotron template code that we copied and pasted. Below are the main highlights so you don’t miss anything:<br />
<br />
<ol><br />
<li>At the bottom, the main javascript file link had a path like ../../js/bootstrap.min.js . Remove the ../../ so it’s just js/bootstrap.min.js, or else it won’t be applied.</li><br />
<li>There is no “jumbotron.css” stylesheet in the default download zip, so we just deleted that link in our index.html and it didn’t seem to matter.</li><br />
<li>We commented out any forms that came with the template. Soholaunch lets you drag and drop login and search boxes already in the page editor.</li><br />
</ol><br />
<br />
<br />
[[category: Templates ]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Main_PageMain Page2014-03-12T18:47:51Z<p>Soho: </p>
<hr />
<div>__NOTOC__<br />
{| width="100%" cellpadding="5" cellspacing="5"<br />
| width="50%" style="font-size: 95%;background-color: #f8fdfb;border: 1px solid #d9e6ef;vertical-align: top;"| <br />
{| width="100%" style="background-color: #f8fdfb;"<br />
|<br />
<h3 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">What's new?</h3><br />
|-<br />
|<br />
*Added articles on [[Building a Foundation responsive template]] and [[Building a Twitter Bootstrap template]]<br />
*Added article on powerful yet under-documented [[UDT_CONTENT_SEARCH_REPLACE|UDT_CONTENT_SEARCH_REPLACE]] feature<br />
*Added article on new [[Userdata_functions|userdata functions]]<br />
*New main page for wiki (you're looking at it)<br />
|-<br />
| style="padding-top: 10px;" |<br />
<br />
<h3 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Popular Pages</h3><br />
*'''[[How_to|How to...]]'''<br />
*[[Custom_Templates|Custom template specs]]<br />
*[[Creating_a_basic_plugin|Creating a basic plugin]]<br />
*[[Plugging-in_to_the_Page_Editor|Plugging-in to the Page Editor]]<br />
<br />
*[[Special:Popularpages|List of most popular pages]]<br />
|}<br />
| width="50%" style="background-color: #f8f9fd; border: 1px solid #dff6ea;vertical-align: top;"|<br />
{| width="100%" style="background-color: #f8fdfb;"<br />
|<br />
<br />
<h3 style="margin:0;background-color:#afc6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Plugins</h3><br />
|-<br />
|<br />
*[[Creating_a_basic_plugin|Creating a basic plugin]] - Step by step "Hello World" example<br />
*[[Userdata_functions|Userdata functions]] - Gotta store miscellaneous settings, prefs, and such? Make things easier on yourself.<br />
*[[Plugging-in_to_the_Page_Editor|Plugging-in to the Page Editor]] - Want your own drag-and-drop object?<br />
|-<br />
| style="padding-top: 10px;" |<br />
<br />
<h3 style="margin:0;background-color:#afc6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Templates</h3><br />
*[[Custom_Templates|Custom template specs]] - The skinny on all #variables#, special files, etc.<br />
*[[Template_Boxes|Using Template Boxes]] - Brief tutorial on using template boxes<br />
*[[Building a Foundation responsive template]] - A walk-through on making a Zurb Foundation template<br />
*[[Building a Twitter Bootstrap template]] - A walk-through on making a Twitter Bootstrap template<br />
|}<br />
|}<br />
<br />
<br />
<br />
*'''[[Special:Allpages|View all wiki pages created so far]]'''<br />
<br />
<br />
==General Wiki Usage Tips==<br />
* [http://en.wikipedia.org/wiki/Wikipedia:How_to_edit_a_page Wikipedia Style Guide]<br />
* [http://www.mediawiki.org/wiki/Help:FAQ MediaWiki FAQ]<br />
* [http://www.mediawiki.org/wiki/Manual:Navigation_bar Editing the side nav bar]<br />
* [http://blog.eukhost.com/2006/09/25/soholaunch-pro-edition Soholaunch links]<br />
* [http://www.mediawiki.org/wiki/Help:FAQ#Basic_Usage Editing/Creating Pages]<br />
* [http://meta.wikimedia.org/wiki/Help:Category#Putting_an_item_in_a_category Creating Categories]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Main_PageMain Page2014-03-12T18:47:20Z<p>Soho: </p>
<hr />
<div>__NOTOC__<br />
{| width="100%" cellpadding="5" cellspacing="5"<br />
| width="50%" style="font-size: 95%;background-color: #f8fdfb;border: 1px solid #d9e6ef;vertical-align: top;"| <br />
{| width="100%" style="background-color: #f8fdfb;"<br />
|<br />
<h3 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">What's new?</h3><br />
|-<br />
|<br />
*Added articles on [[Building a Foundation responsive template]] and [[Building a Twitter Bootstrap template]]<br />
*Added article on powerful yet under-documented [[UDT_CONTENT_SEARCH_REPLACE|UDT_CONTENT_SEARCH_REPLACE]] feature<br />
*Added article on new [[Userdata_functions|userdata functions]]<br />
*New main page for wiki (you're looking at it)<br />
|-<br />
| style="padding-top: 10px;" |<br />
<br />
<h3 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Popular Pages</h3><br />
*'''[[How_to|How to...]]'''<br />
*[[Custom_Templates|Custom template specs]]<br />
*[[Creating_a_basic_plugin|Creating a basic plugin]]<br />
*[[Plugging-in_to_the_Page_Editor|Plugging-in to the Page Editor]]<br />
<br />
*[[Special:Popularpages|List of most popular pages]]<br />
|}<br />
| width="50%" style="background-color: #f8f9fd; border: 1px solid #dff6ea;vertical-align: top;"|<br />
{| width="100%" style="background-color: #f8fdfb;"<br />
|<br />
<br />
<h3 style="margin:0;background-color:#afc6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Plugins</h3><br />
|-<br />
|<br />
*[[Creating_a_basic_plugin|Creating a basic plugin]] - Step by step "Hello World" example<br />
*[[Userdata_functions|Userdata functions]] - Gotta store miscellaneous settings, prefs, and such? Make things easier on yourself.<br />
*[[Plugging-in_to_the_Page_Editor|Plugging-in to the Page Editor]] - Want your own drag-and-drop object?<br />
|-<br />
| style="padding-top: 10px;" |<br />
<br />
<h3 style="margin:0;background-color:#afc6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Templates</h3><br />
*[[Custom_Templates|Custom template specs]] - The skinny on all #variables#, special files, etc.<br />
*[[Template_Boxes|Using Template Boxes]] - Brief tutorial on using template boxes<br />
*[[Addon_licensed|addon_licensed()]] - Add a license check to your premium (paid) templates<br />
*[[Building responsive templates]] - A walk-through on making a Zurb Foundation template<br />
*[[Building a Twitter Bootstrap template]] - A walk-through on making a Twitter Bootstrap template<br />
|}<br />
|}<br />
<br />
<br />
<br />
*'''[[Special:Allpages|View all wiki pages created so far]]'''<br />
<br />
<br />
==General Wiki Usage Tips==<br />
* [http://en.wikipedia.org/wiki/Wikipedia:How_to_edit_a_page Wikipedia Style Guide]<br />
* [http://www.mediawiki.org/wiki/Help:FAQ MediaWiki FAQ]<br />
* [http://www.mediawiki.org/wiki/Manual:Navigation_bar Editing the side nav bar]<br />
* [http://blog.eukhost.com/2006/09/25/soholaunch-pro-edition Soholaunch links]<br />
* [http://www.mediawiki.org/wiki/Help:FAQ#Basic_Usage Editing/Creating Pages]<br />
* [http://meta.wikimedia.org/wiki/Help:Category#Putting_an_item_in_a_category Creating Categories]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Main_PageMain Page2014-03-12T18:46:29Z<p>Soho: </p>
<hr />
<div>__NOTOC__<br />
{| width="100%" cellpadding="5" cellspacing="5"<br />
| width="50%" style="font-size: 95%;background-color: #f8fdfb;border: 1px solid #d9e6ef;vertical-align: top;"| <br />
{| width="100%" style="background-color: #f8fdfb;"<br />
|<br />
<h3 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">What's new?</h3><br />
|-<br />
|<br />
*Added articles on [[Building a Foundation Responsive template]] and [[Building a Twitter Bootstrap template]]<br />
*Added article on powerful yet under-documented [[UDT_CONTENT_SEARCH_REPLACE|UDT_CONTENT_SEARCH_REPLACE]] feature<br />
*Added article on new [[Userdata_functions|userdata functions]]<br />
*New main page for wiki (you're looking at it)<br />
|-<br />
| style="padding-top: 10px;" |<br />
<br />
<h3 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Popular Pages</h3><br />
*'''[[How_to|How to...]]'''<br />
*[[Custom_Templates|Custom template specs]]<br />
*[[Creating_a_basic_plugin|Creating a basic plugin]]<br />
*[[Plugging-in_to_the_Page_Editor|Plugging-in to the Page Editor]]<br />
<br />
*[[Special:Popularpages|List of most popular pages]]<br />
|}<br />
| width="50%" style="background-color: #f8f9fd; border: 1px solid #dff6ea;vertical-align: top;"|<br />
{| width="100%" style="background-color: #f8fdfb;"<br />
|<br />
<br />
<h3 style="margin:0;background-color:#afc6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Plugins</h3><br />
|-<br />
|<br />
*[[Creating_a_basic_plugin|Creating a basic plugin]] - Step by step "Hello World" example<br />
*[[Userdata_functions|Userdata functions]] - Gotta store miscellaneous settings, prefs, and such? Make things easier on yourself.<br />
*[[Plugging-in_to_the_Page_Editor|Plugging-in to the Page Editor]] - Want your own drag-and-drop object?<br />
|-<br />
| style="padding-top: 10px;" |<br />
<br />
<h3 style="margin:0;background-color:#afc6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Templates</h3><br />
*[[Custom_Templates|Custom template specs]] - The skinny on all #variables#, special files, etc.<br />
*[[Template_Boxes|Using Template Boxes]] - Brief tutorial on using template boxes<br />
*[[Addon_licensed|addon_licensed()]] - Add a license check to your premium (paid) templates<br />
*[[Building responsive templates]] - A walk-through on making a Zurb Foundation template<br />
*[[Building a Twitter Bootstrap template]] - A walk-through on making a Twitter Bootstrap template<br />
|}<br />
|}<br />
<br />
<br />
<br />
*'''[[Special:Allpages|View all wiki pages created so far]]'''<br />
<br />
<br />
==General Wiki Usage Tips==<br />
* [http://en.wikipedia.org/wiki/Wikipedia:How_to_edit_a_page Wikipedia Style Guide]<br />
* [http://www.mediawiki.org/wiki/Help:FAQ MediaWiki FAQ]<br />
* [http://www.mediawiki.org/wiki/Manual:Navigation_bar Editing the side nav bar]<br />
* [http://blog.eukhost.com/2006/09/25/soholaunch-pro-edition Soholaunch links]<br />
* [http://www.mediawiki.org/wiki/Help:FAQ#Basic_Usage Editing/Creating Pages]<br />
* [http://meta.wikimedia.org/wiki/Help:Category#Putting_an_item_in_a_category Creating Categories]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Building_a_Twitter_Bootstrap_templateBuilding a Twitter Bootstrap template2014-03-12T18:42:59Z<p>Soho: </p>
<hr />
<div>The following is a guide for creating a Soholaunch template with Twitter Bootstrap.<br />
<br />
Here’s the complete working template file that this guide uses: http://site.soholaunch.com/media/bootstrap-basic-gray.zip<br />
<br />
Feel free to download it and use it.<br />
<br />
<h2>Main getting started steps:</h2><br />
<br />
<ol><br />
<li>Download the CSS version of bootstrap at: http://getbootstrap.com/</li><br />
(that is, not the Less or Sass versions. You can use Less or Sass, but this guide covers using the CSS version for now)<br />
<li>Put the zip in your template folder. Here’s the path: sohoadmin/program/modules/site_templates/pages . And extract the zip.</li><br />
<li>Add an index.html file. As of this writing, a default index.html doesn’t come with the zip, but Bootstrap’s example templates are here, under “examples”: http://getbootstrap.com/getting-started/</li><br />
<li>If using one of their templates, open one in your browser, view the source and copy and paste it into your index.html file and save it in your template folder. This guide uses the “Jumbotron” template.</li><br />
<li>Add the #relative_template_path# pound variable to any links to Bootstrap’s default stylesheets.</li><br />
<li>Add the pound variables, a custom.css file, and then start making your template.</li><br />
</ol><br />
<br />
<h2>The menu</h2><br />
<br />
The main things the menu needs are certain css classes added to different elements. Copy the pgm-auto_menu.php found inside the zip file at the top of this doc, and paste it into your template folder. We added the required classes to it to make the menu work (like collapse into the “hamburger” icon, and retain all the drop-down menu items).<br />
<br />
Add the #hmains# pound variable into the correct place in index.html for the menu. It’s usually where the template starts building out the menu with unordered list items (i.e. ul’s and li’s).<br />
<br />
<h2>Our index.html and commentary</h2><br />
<br />
If you take a look at the index.html file in our template zip, you'll see we made a few changes. We had to change a few things from the Jumbotron template code that we copied and pasted. Below are the main highlights so you don’t miss anything:<br />
<br />
<ol><br />
<li>At the bottom, the main javascript file link had a path like ../../js/bootstrap.min.js . Remove the ../../ so it’s just js/bootstrap.min.js, or else it won’t applied.</li><br />
<li>There is no “jumbotron.css” stylesheet in the default download zip, so we just deleted that link in our index.html and it didn’t seem to matter.</li><br />
<li>We commented out any forms that came with the template. Soholaunch lets you drag and drop login and search boxes already in the page editor.</li><br />
</ol><br />
<br />
<br />
[[category: Templates ]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Building_a_Twitter_Bootstrap_templateBuilding a Twitter Bootstrap template2014-03-12T18:41:52Z<p>Soho: </p>
<hr />
<div>The following is a guide for creating a Soholaunch template with Twitter Bootstrap.<br />
<br />
Here’s the complete working template file that this guide uses: http://site.soholaunch.com/media/bootstrap-basic-gray.zip<br />
<br />
Feel free to download it and use it.<br />
<br />
<h2>Main getting started steps:</h2><br />
<br />
<ol><br />
<li>Download the CSS version of bootstrap at: http://getbootstrap.com/</li><br />
(that is, not the Less or Sass versions. You can use Less or Sass, but this guide covers using the CSS version for now)<br />
<li>Put the zip in your template folder. Here’s the path: sohoadmin/program/modules/site_templates/pages . And extract the zip.</li><br />
<li>Add an index.html file. As of this writing, a default index.html doesn’t come with the zip, but Bootstrap’s example templates are here, under “examples”: http://getbootstrap.com/getting-started/</li><br />
<li>If using one of their templates, open one in your browser, view the source and copy and paste it into your index.html file and save it in your template folder. This guide uses the “Jumbotron” template.</li><br />
<li>Add the #relative_template_path# pound variable to any links to Bootstrap’s default stylesheets.</li><br />
<li>Add the pound variables, a custom.css file, and then start making your template.</li><br />
</ol><br />
<br />
<h2>The menu</h2><br />
<br />
The main things menu needs are certain css classes added to different elements. Copy the pgm-auto_menu.php found inside the zip file at the top of this doc, and paste it into your template folder. We added the required classes to it to make the menu work (like collapse into the “hamburger” icon, and retain all the drop-down menu items)<br />
<br />
Add the #hmains# pound variable into the correct place in index.html for the menu. It’s usually where the template starts building out the menu with unordered list items (i.e. ul’s and li’s)<br />
<br />
<h2>Our index.html and commentary</h2><br />
<br />
If you take a look at the index.html file in our template zip, you'll see we made a few changes. We had to change a few things from the Jumbotron template code that we copied and pasted. Below are the main highlights so you don’t miss anything:<br />
<br />
<ol><br />
<li>At the bottom, the main javascript file link had a path like ../../js/bootstrap.min.js . Remove the ../../ so it’s just js/bootstrap.min.js, or else it won’t applied.</li><br />
<li>There is no “jumbotron.css” stylesheet in the default download zip, so we just deleted that link in our index.html and it didn’t seem to matter.</li><br />
<li>We commented out any forms that came with the template. Soholaunch lets you drag and drop login and search boxes already in the page editor.</li><br />
</ol><br />
<br />
<br />
[[category: Templates ]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Building_a_Twitter_Bootstrap_templateBuilding a Twitter Bootstrap template2014-03-12T18:40:48Z<p>Soho: Created page with "The following is a guide for creating a Soholaunch template with Twitter Bootstrap. Here’s the complete working template file that this guide uses: http://site.soholaunch.c..."</p>
<hr />
<div>The following is a guide for creating a Soholaunch template with Twitter Bootstrap.<br />
<br />
Here’s the complete working template file that this guide uses: http://site.soholaunch.com/media/bootstrap-basic-gray.zip<br />
<br />
Feel free to download it and use it.<br />
<br />
<h2>Main getting started steps:</h2><br />
<br />
<ol><br />
<li>Download the CSS version of bootstrap at: http://getbootstrap.com/</li><br />
(that is, not the Less or Sass versions. You can use Less or Sass, but this guide covers using the CSS version for now)<br />
<li>Put the zip in your template folder. Here’s the path: sohoadmin/program/modules/site_templates/pages . And extract the zip.</li><br />
<li>Add an index.html file. As of this writing, a default index.html doesn’t come with the zip, but Bootstrap’s example templates are here, under “examples”: http://getbootstrap.com/getting-started/</li><br />
<li>If using one of their templates, open one in your browser, view the source and copy and paste it into your index.html file and save it in your template folder. This guide uses the “Jumbotron” template.</li><br />
<li>Add the #relative_template_path# pound variable to any links to Bootstrap’s default stylesheets.</li><br />
<li>Add the pound variables, a custom.css file, and then start making your template.</li><br />
</ol><br />
<br />
<h2>The menu</h2><br />
<br />
The main the menu needs is certain css classes added to different elements. Copy the pgm-auto_menu.php found inside the zip file at the top of this doc, and paste it into your template folder. We added the required classes to it to make the menu work (like collapse into the “hamburger” icon, and retain all the drop-down menu items)<br />
<br />
Add the #hmains# pound variable into the correct place in index.html for the menu. It’s usually where the template starts building out the menu with unordered list items (i.e. ul’s and li’s)<br />
<br />
<h2>Our index.html and commentary</h2><br />
<br />
If you take a look at the index.html file in our template zip, you'll see we made a few changes. We had to change a few things from the Jumbotron template code that we copied and pasted. Below are the main highlights so you don’t miss anything:<br />
<br />
<ol><br />
<li>At the bottom, the main javascript file link had a path like ../../js/bootstrap.min.js . Remove the ../../ so it’s just js/bootstrap.min.js, or else it won’t applied.</li><br />
<li>There is no “jumbotron.css” stylesheet in the default download zip, so we just deleted that link in our index.html and it didn’t seem to matter.</li><br />
<li>We commented out any forms that came with the template. Soholaunch lets you drag and drop login and search boxes already in the page editor.</li><br />
</ol><br />
<br />
<br />
[[category: Templates ]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Building_a_Foundation_responsive_templateBuilding a Foundation responsive template2014-03-12T18:33:14Z<p>Soho: Created page with "This is a guide for building responsive templates in Soholaunch. The guide will use the CSS version of the Zurb Foundation 5 framework (as opposed to the Sass version). Most o..."</p>
<hr />
<div>This is a guide for building responsive templates in Soholaunch. The guide will use the CSS version of the Zurb Foundation 5 framework (as opposed to the Sass version). Most of the process transfers over to other frameworks like Twitter Bootstrap. Here is the complete working template file that the sample code in this wiki comes from: http://site.soholaunch.com/media/Responsive-Elegant-pink.zip . Feel free to download it and use it for reference.<br />
<br />
<h2>1. Download Zurb Foundation at: http://foundation.zurb.com/develop/download.html</h2><br />
<br />
Download either the default CSS or make your own custom CSS package. Either way, it will give you a .zip file to download. Save it to your computer.<br />
<br />
<h2>2. Extract the zip in your project folder</h2><br />
<br />
Go to the template folder in your Soholaunch installation:<br />
/sohoadmin/program/modules/site_templates/pages<br />
<br />
Make a folder for your template. Put the zip file inside of it and extract it. You should have some folders like css/js/img and an index.html file. The folder structure will look sort of like this:<br />
<br />
http://site.soholaunch.com/media/folder-structure-extracted.jpg<br />
<br />
<h2>3. Add the relative template path variable</h2><br />
<br />
Open index.html in your code editor. In the head section, you will have a link to the core foundation.css file. You need to add #relative_template_path# at the beginning of that link so it is applied. It should look something like this:<br />
<pre><br />
<head><br />
<meta charset="utf-8" /><br />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /><br />
<title>#title#</title><br />
<link rel="stylesheet" href="#relative_template_path#/css/foundation.css" /> <!- Must add #relative_template_path# --><br />
<script src="js/vendor/modernizr.js"></script><br />
</head><br />
</pre><br />
<br />
<h2>4. Build and style your template</h2><br />
<br />
Create a custom.css in your template folder. Add your own custom css to it. This is instead of adding it to the foundation.css so things are a little more organized. No need to link custom.css in your html as long as you keep the file name custom.css exactly. (Soholaunch already links it on its own).<br />
<br />
Add the pound variables in your index.html. Put them inside of the column classes of the grid like they are actual content. <br />
<br />
See more about the pound variables at the [[Custom_Templates]] wiki page.<br />
<br />
<h2>More about the menu</h2><br />
<br />
Soholaunch developers have found that responsive frameworks have pesky menus - Foundation included. As a general rule, you usually need to follow the framework’s documentation and sample code very closely, or the menu may not function right.<br />
<br />
Below is a rundown of how the Soholaunch developers have implemented the Foundation 5 menu to use Soholaunch’s menu system. This lets the menu toggle into the “hamburger” / “pancake” icon for mobile devices and retain all drop-down menu items.<br />
<br />
First, we copied the sample menu code from the Foundation Top Bar doc and pasted it into our index.html. Here’s the link to the doc we used:<br />
<br />
http://foundation.zurb.com/docs/components/topbar.html<br />
<br />
There is a point when the sample code begins building out the menu with unordered lists (i.e. ul and li). That is where you should add the Soholaunch menu pound variable instead. To illustrate, here is what our code looks like:<br />
<br />
<pre><br />
<nav class="top-bar" data-topbar data-options="mobile_show_parent_link: true" role="primary"> <!--Begin navigation structure--><br />
<ul class="title-area"><br />
<li class="name"> <br />
<h1></h1> <!--Have to have this to make menu work, even if it's empty --><br />
</li><br />
<li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li><br />
</ul><br />
<section class="top-bar-section"><br />
<div class="nav-bar">#hmains#</div><!--This is where we added hmains instead of the list items--> <br />
</section> <br />
</nav> <!--End of navigation structure--><br />
</pre><br />
<br />
You’ll see we added #hmains# where the sample code builds out the menu links with unordered lists. The hmains pound variable will add those links for you and let you use the Soholaunch menu manager.<br />
<br />
Here's the PHP file we made that turns hmains into list items and applies the drop-down classes that Foundation 5 needs:<br />
<br />
http://site.soholaunch.com/media/pgm-auto_menu.txt<br />
<br />
Copy and paste it into your editor and then save it as a .php file. Then put it in your template folder.<br />
<br />
<strong>Note:</strong> To style the top bar, we had to work off of (fight) the default css classes that Foundation applies to it (use your browser’s code inspector to see what classes are getting applied). Or we added our own classes.<br />
<br />
<h2>Final folder structure (for reference)</h2><br />
<br />
In the end, a bare minimum folder structure will look something like this:<br />
<br />
http://site.soholaunch.com/media/final-folder-structure.jpg<br />
<br />
Here are the things that are different:<br />
<ul><br />
<li>Deleted the original Foundation zip file (don’t need it anymore. Keep it if you want)</li><br />
<li>Deleted robots.txt and humans.txt (these aren’t necessary in the template folder)</li><br />
<li>Added screenshot.jpg, which will show in the Soholaunch template manager</li><br />
</ul><br />
<br />
<h2>Sample index.html file and commentary</h2><br />
<br />
Here you’ll see a sample index.html using the Foundation framework. These are the highlights that the developer did in this sample:<br />
<br />
<ul><br />
<li>Wrapped the main content areas like box1 and content and the footer in their own Foundation column classes i.e. large-12, large-4. This follows the same process recommended by Foundation’s documentation about the grid. Read more about the grid here: http://foundation.zurb.com/docs/components/grid.html</li><br />
<li>Added my own css classes outside of Foundation’s when I needed to, like “box”, and styled them in my custom.css file.</li><br />
<li>Used Ultra’s built-in #jquery# pound variable and added my own custom jQuery scripts (at the bottom). Deleted the jQuery link that comes with the default index.html. You can add jQuery however you prefer.</li><br />
</ul><br />
<br />
<pre><br />
<!doctype html><br />
<html class="no-js" lang="en"><br />
<head><br />
<meta charset="utf-8" /><br />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /><br />
<title>#title#</title><br />
<link rel="stylesheet" href="#relative_template_path#/css/foundation.css" /><br />
<script src="#relative_template_path#/js/vendor/modernizr.js"></script><br />
</head><br />
<body><br />
<div class="wrapper"><br />
<div class="logo-banner"><br />
<h1 class="logo">#logo#-alt#logoimg#</h1><br />
</div> <br />
<div class="slogan-banner"><br />
<h2 class="slogan">#slogan#</h2><br />
</div><br />
<section class="bar-nav"><br />
<div class="row"> <br />
<div class="large-12 columns"> <br />
<nav class="top-bar" data-topbar data-options="mobile_show_parent_link: true" role="primary"> <!--Begin navigation structure--><br />
<ul class="title-area"><br />
<li class="name"> <br />
<h1></h1> <!--Have to have this to make menu work, even if it's empty --><br />
</li><br />
<li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li><br />
</ul><br />
<section class="top-bar-section"><br />
<div class="nav-bar">#hmains#</div> <br />
</section> <br />
</nav> <!--End of navigation structure--><br />
</div> <br />
</div> <br />
</section> <br />
<div class="row"><br />
<div class="large-8 columns middle"><br />
<div class="row"><br />
<div class="callout panel content"><br />
#content#<br />
&nbsp; <!--Helps keep the sidebar in place--><br />
</div><br />
</div><br />
</div> <br />
<div class="large-4 columns"> <br />
<div id="box-one" class="panel box"><br />
#BOX1# <br />
</div><br />
</div><br />
<div class="push"></div><br />
</div><br />
</div><br />
<section class="footer"><br />
<div class="row"><br />
<div class="large-12 columns"><br />
#copyright# <br />
</div><br />
</div><br />
</section> <br />
#jquery#<br />
<script><br />
/* Remove the slogan div cleanly if it's not in use */<br />
$(function () {<br />
if($(".slogan").html().length === 0) {<br />
$(".slogan").remove();<br />
}<br />
/* Expand the content area out if the sidebar isn't in use */<br />
if (!$("#box-one").text().trim().length){<br />
$(".middle").addClass("large-12").removeClass("large-8");<br />
$(".box").remove();<br />
}<br />
});<br />
</script><br />
<script src="js/foundation.min.js"></script><br />
<script><br />
$(document).foundation();<br />
</script><br />
</body><br />
</html><br />
</pre><br />
<br />
[[Category:Templates]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Category:TemplatesCategory:Templates2014-03-12T14:18:31Z<p>Soho: Protected "Category:Templates" ([edit=sysop] (indefinite) [move=sysop] (indefinite))</p>
<hr />
<div></div>Sohohttps://wiki.soholaunch.com/index.php?title=Category:TemplatesCategory:Templates2014-03-12T14:14:27Z<p>Soho: Unprotected "Category:Templates"</p>
<hr />
<div></div>Sohohttps://wiki.soholaunch.com/index.php?title=Main_PageMain Page2014-03-05T19:09:35Z<p>Soho: Added responsive templates page under templates section</p>
<hr />
<div>__NOTOC__<br />
{| width="100%" cellpadding="5" cellspacing="5"<br />
| width="50%" style="font-size: 95%;background-color: #f8fdfb;border: 1px solid #d9e6ef;vertical-align: top;"| <br />
{| width="100%" style="background-color: #f8fdfb;"<br />
|<br />
<h3 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">What's new?</h3><br />
|-<br />
|<br />
*Added article on [[Building responsive templates]]<br />
*Added article on powerful yet under-documented [[UDT_CONTENT_SEARCH_REPLACE|UDT_CONTENT_SEARCH_REPLACE]] feature<br />
*Added article on new [[Userdata_functions|userdata functions]]<br />
*New main page for wiki (you're looking at it)<br />
|-<br />
| style="padding-top: 10px;" |<br />
<br />
<h3 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Popular Pages</h3><br />
*'''[[How_to|How to...]]'''<br />
*[[Custom_Templates|Custom template specs]]<br />
*[[Creating_a_basic_plugin|Creating a basic plugin]]<br />
*[[Plugging-in_to_the_Page_Editor|Plugging-in to the Page Editor]]<br />
<br />
*[[Special:Popularpages|List of most popular pages]]<br />
|}<br />
| width="50%" style="background-color: #f8f9fd; border: 1px solid #dff6ea;vertical-align: top;"|<br />
{| width="100%" style="background-color: #f8fdfb;"<br />
|<br />
<br />
<h3 style="margin:0;background-color:#afc6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Plugins</h3><br />
|-<br />
|<br />
*[[Creating_a_basic_plugin|Creating a basic plugin]] - Step by step "Hello World" example<br />
*[[Userdata_functions|Userdata functions]] - Gotta store miscellaneous settings, prefs, and such? Make things easier on yourself.<br />
*[[Plugging-in_to_the_Page_Editor|Plugging-in to the Page Editor]] - Want your own drag-and-drop object?<br />
|-<br />
| style="padding-top: 10px;" |<br />
<br />
<h3 style="margin:0;background-color:#afc6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Templates</h3><br />
*[[Custom_Templates|Custom template specs]] - The skinny on all #variables#, special files, etc.<br />
*[[Template_Boxes|Using Template Boxes]] - Brief tutorial on using template boxes<br />
*[[Addon_licensed|addon_licensed()]] - Add a license check to your premium (paid) templates<br />
*[[Building responsive templates]] - A walk-through with code samples on making a responsive template<br />
|}<br />
|}<br />
<br />
<br />
<br />
*'''[[Special:Allpages|View all wiki pages created so far]]'''<br />
<br />
<br />
==General Wiki Usage Tips==<br />
* [http://en.wikipedia.org/wiki/Wikipedia:How_to_edit_a_page Wikipedia Style Guide]<br />
* [http://www.mediawiki.org/wiki/Help:FAQ MediaWiki FAQ]<br />
* [http://www.mediawiki.org/wiki/Manual:Navigation_bar Editing the side nav bar]<br />
* [http://blog.eukhost.com/2006/09/25/soholaunch-pro-edition Soholaunch links]<br />
* [http://www.mediawiki.org/wiki/Help:FAQ#Basic_Usage Editing/Creating Pages]<br />
* [http://meta.wikimedia.org/wiki/Help:Category#Putting_an_item_in_a_category Creating Categories]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Category:TemplatesCategory:Templates2014-03-05T19:04:26Z<p>Soho: Changed protection level for "Category:Templates" ([edit=sysop] (indefinite) [move=sysop] (indefinite))</p>
<hr />
<div></div>Sohohttps://wiki.soholaunch.com/index.php?title=Category:TemplatesCategory:Templates2014-03-05T19:04:03Z<p>Soho: Protected "Category:Templates" ([edit=autoconfirmed] (indefinite) [move=autoconfirmed] (indefinite))</p>
<hr />
<div></div>Sohohttps://wiki.soholaunch.com/index.php?title=Category:TemplatesCategory:Templates2014-03-05T19:01:21Z<p>Soho: Unprotected "Category:Templates"</p>
<hr />
<div></div>Sohohttps://wiki.soholaunch.com/index.php?title=Main_PageMain Page2014-03-05T18:59:18Z<p>Soho: </p>
<hr />
<div>__NOTOC__<br />
{| width="100%" cellpadding="5" cellspacing="5"<br />
| width="50%" style="font-size: 95%;background-color: #f8fdfb;border: 1px solid #d9e6ef;vertical-align: top;"| <br />
{| width="100%" style="background-color: #f8fdfb;"<br />
|<br />
<h3 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">What's new?</h3><br />
|-<br />
|<br />
*Added article on [[Building responsive templates]]<br />
*Added article on powerful yet under-documented [[UDT_CONTENT_SEARCH_REPLACE|UDT_CONTENT_SEARCH_REPLACE]] feature<br />
*Added article on new [[Userdata_functions|userdata functions]]<br />
*New main page for wiki (you're looking at it)<br />
|-<br />
| style="padding-top: 10px;" |<br />
<br />
<h3 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Popular Pages</h3><br />
*'''[[How_to|How to...]]'''<br />
*[[Custom_Templates|Custom template specs]]<br />
*[[Creating_a_basic_plugin|Creating a basic plugin]]<br />
*[[Plugging-in_to_the_Page_Editor|Plugging-in to the Page Editor]]<br />
<br />
*[[Special:Popularpages|List of most popular pages]]<br />
|}<br />
| width="50%" style="background-color: #f8f9fd; border: 1px solid #dff6ea;vertical-align: top;"|<br />
{| width="100%" style="background-color: #f8fdfb;"<br />
|<br />
<br />
<h3 style="margin:0;background-color:#afc6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Plugins</h3><br />
|-<br />
|<br />
*[[Creating_a_basic_plugin|Creating a basic plugin]] - Step by step "Hello World" example<br />
*[[Userdata_functions|Userdata functions]] - Gotta store miscellaneous settings, prefs, and such? Make things easier on yourself.<br />
*[[Plugging-in_to_the_Page_Editor|Plugging-in to the Page Editor]] - Want your own drag-and-drop object?<br />
|-<br />
| style="padding-top: 10px;" |<br />
<br />
<h3 style="margin:0;background-color:#afc6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Templates</h3><br />
*[[Custom_Templates|Custom template specs]] - The skinny on all #variables#, special files, etc.<br />
*[[Template_Boxes|Using Template Boxes]] - Brief tutorial on using template boxes.<br />
*[[Addon_licensed|addon_licensed()]] - Add a license check to your premium (paid) templates<br />
|}<br />
|}<br />
<br />
<br />
<br />
*'''[[Special:Allpages|View all wiki pages created so far]]'''<br />
<br />
<br />
==General Wiki Usage Tips==<br />
* [http://en.wikipedia.org/wiki/Wikipedia:How_to_edit_a_page Wikipedia Style Guide]<br />
* [http://www.mediawiki.org/wiki/Help:FAQ MediaWiki FAQ]<br />
* [http://www.mediawiki.org/wiki/Manual:Navigation_bar Editing the side nav bar]<br />
* [http://blog.eukhost.com/2006/09/25/soholaunch-pro-edition Soholaunch links]<br />
* [http://www.mediawiki.org/wiki/Help:FAQ#Basic_Usage Editing/Creating Pages]<br />
* [http://meta.wikimedia.org/wiki/Help:Category#Putting_an_item_in_a_category Creating Categories]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Main_PageMain Page2014-03-05T18:54:31Z<p>Soho: </p>
<hr />
<div>__NOTOC__<br />
{| width="100%" cellpadding="5" cellspacing="5"<br />
| width="50%" style="font-size: 95%;background-color: #f8fdfb;border: 1px solid #d9e6ef;vertical-align: top;"| <br />
{| width="100%" style="background-color: #f8fdfb;"<br />
|<br />
<h3 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">What's new?</h3><br />
|-<br />
|<br />
*Added article on [[Building_responsive_templates]]<br />
*Added article on powerful yet under-documented [[UDT_CONTENT_SEARCH_REPLACE|UDT_CONTENT_SEARCH_REPLACE]] feature<br />
*Added article on new [[Userdata_functions|userdata functions]]<br />
*New main page for wiki (you're looking at it)<br />
|-<br />
| style="padding-top: 10px;" |<br />
<br />
<h3 style="margin:0;background-color:#a5e6b3;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Popular Pages</h3><br />
*'''[[How_to|How to...]]'''<br />
*[[Custom_Templates|Custom template specs]]<br />
*[[Creating_a_basic_plugin|Creating a basic plugin]]<br />
*[[Plugging-in_to_the_Page_Editor|Plugging-in to the Page Editor]]<br />
<br />
*[[Special:Popularpages|List of most popular pages]]<br />
|}<br />
| width="50%" style="background-color: #f8f9fd; border: 1px solid #dff6ea;vertical-align: top;"|<br />
{| width="100%" style="background-color: #f8fdfb;"<br />
|<br />
<br />
<h3 style="margin:0;background-color:#afc6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Plugins</h3><br />
|-<br />
|<br />
*[[Creating_a_basic_plugin|Creating a basic plugin]] - Step by step "Hello World" example<br />
*[[Userdata_functions|Userdata functions]] - Gotta store miscellaneous settings, prefs, and such? Make things easier on yourself.<br />
*[[Plugging-in_to_the_Page_Editor|Plugging-in to the Page Editor]] - Want your own drag-and-drop object?<br />
|-<br />
| style="padding-top: 10px;" |<br />
<br />
<h3 style="margin:0;background-color:#afc6e6;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Templates</h3><br />
*[[Custom_Templates|Custom template specs]] - The skinny on all #variables#, special files, etc.<br />
*[[Template_Boxes|Using Template Boxes]] - Brief tutorial on using template boxes.<br />
*[[Addon_licensed|addon_licensed()]] - Add a license check to your premium (paid) templates<br />
|}<br />
|}<br />
<br />
<br />
<br />
*'''[[Special:Allpages|View all wiki pages created so far]]'''<br />
<br />
<br />
==General Wiki Usage Tips==<br />
* [http://en.wikipedia.org/wiki/Wikipedia:How_to_edit_a_page Wikipedia Style Guide]<br />
* [http://www.mediawiki.org/wiki/Help:FAQ MediaWiki FAQ]<br />
* [http://www.mediawiki.org/wiki/Manual:Navigation_bar Editing the side nav bar]<br />
* [http://blog.eukhost.com/2006/09/25/soholaunch-pro-edition Soholaunch links]<br />
* [http://www.mediawiki.org/wiki/Help:FAQ#Basic_Usage Editing/Creating Pages]<br />
* [http://meta.wikimedia.org/wiki/Help:Category#Putting_an_item_in_a_category Creating Categories]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Custom_Template_ReferenceCustom Template Reference2014-02-03T18:18:20Z<p>Soho: /* #JQUERY# (Ultra Only) */</p>
<hr />
<div>[[Category:Templates]]<br />
<br />
==Download .zip how-to package with PDF tutorial==<br />
Want to learn how to create your own templates for Pro Edition? [https://addons.soholaunch.com/media/Creating_Custom_Template_for_SOHO.zip Download this great how-to article] (with example files!) written by Soholaunch customer Jaun-Vincent Haasbroek.<br />
<br />
==Introduction==<br />
This section covers the creation and integration of custom templates for use with the Soholaunch Pro Edition, and is intended for graphic designers and site developers. As such, a working knowledge of Adobe Photoshop and HTML programming is recommended.<br />
<br />
===How Pro Edition interprets template information===<br />
Within the maintenance platform, users will only have access to the page “content” area for editing. This means that each site must have a template design that maintains continuity throughout the site. Automatic menu generation is built in to the Soholaunch management tool so that Menu Display buttons and sub-page buttons can be defined within the template (using special Pound Variables). This gives you the option of placing Menu Display systems vertically, on the left or right of the page layout, or horizontally, across the top or bottom of your pages.<br />
<br />
You may also wish to custom-design your main navigation system and not use the Menu Display feature at all. This allows you to have total control over font, colors and sizes of your navigation structure. For even greater flexibility in design, different templates may be assigned to individual site pages throughout your site.<br />
<br />
Your template designs can take on any level of complexity that you wish them to have. However, please note that the user, via the management tool, cannot change any images, text, or links built into the template. This should always be planned and noted well ahead of the build process.<br />
<br />
==Template folder and files==<br />
Place all files(images,index.html,custom.css, etc) into a folder and name the folder like this...<br />
<pre><br />
Category-Sub_Category-Color<br />
<br />
Example: Category-Template_Name-Color<br />
</pre><br />
<br />
Possible files in your template folder (aside from images):<br />
<br />
'''index.html''' (REQUIRED) - The main HTML template file for your website used accross all site pages. This file must exist in your template folder in order for site pages to display at all.<br />
<br />
'''cart.html''' (OPTIONAL) - Custom shopping cart template. If found in your template folder, it will be used in place of index.html on shopping cart system pages (as in: when website visitor is browsing/purchasing products via your online checkout process).<br />
<br />
'''home.html''' (OPTIONAL) - If found in your template folder, it will be used in place of index.html on the "Home Page" (whatever page you've assigned to be your start/index/home/default page).<br />
<br />
'''news.html''' (OPTIONAL) - Custom blog/article display template. If found in your template folder, it will be used in place of index.html when visitor views full text of blog entry or news item.<br />
<br />
'''custom.css''' (OPTIONAL) - If found in your template folder, it will be used in place of the default stylesheet (runtime.css).<br />
<br />
'''cart.css''' (OPTIONAL) - If found in your template folder, it will be used in place of the default stylesheet (runtime.css) on shopping cart system pages. This is mainly usefull in conjunction with cart.html. That way you can have a separate template html file as well as a separate style sheet for shopping cart system pages.<br />
<br />
'''[[Modifying_cart_system_styles|shopping_cart.css]]''' (OPTIONAL) - If found in your template folder, will be included instead of pulling the colors/styles set in Shopping Cart > Display Settings. Note that this performs a completely different function than cart.css.<br />
<br />
'''template_variable_rules.php''' (OPTIONAL) - If found in your template folder, it will be included within pgm-realtime_builder.php right before all of the other #variables# are processed, allowing your template to use custom pound variables <br />
and even override standard pound variable functionality if you want to.<br />
<br />
===Source file overrides===<br />
'''pgm-auto_menu.php''' (OPTIONAL) - This is the file that puts together the html output for the various menu navigation systems (vmenu, hmains, etc) when your website is viewed. If found in your template folder, it will be used instead of the standard pgm-auto_menu.php file. The idea here it to download the original pgm-auto_menu.php from your docroot or from sohoadmin/client_files/base_files (same file, 2 locations), make a copy of it and stick it in your template folder, then modify it to all kinds of crazy things with your menu system.<br />
<br />
'''pgm-faq_display.php''' (OPTIONAL) - When a visitor views a page with FAQs on it, this file is called to build the HTML output for the FAQs. If you make a copy of this file and stick it in your template folder, your (presumably modified) copy will be used instead of the standard file. Do this when you want to trick out how your FAQs display, [http://info.soholaunch.com/Support.php like Soholaunch did on our main website] --- links to the support page, scroll down to see FAQs...we added those big 'Q' graphics and customized the font.<br />
<br />
'''pgm-promo_boxes.php''' (OPTIONAL) - When a visitor views a page whose template uses #NEWSBOX#, #BOX1#, etc, this file is called to build the HTML output for the news/promo boxes. If you make a copy of this file and stick it in your template folder, your (presumably modified) copy will be used instead of the standard file. Do this when you want to trick out how your news/promo boxes display further than you can via the Template Box Manager. Literally unlimited modification potential here.<br />
<br />
'''pgm-blog_display.php''' (OPTION) - Called when visitor views a page with a blog dropped on it. This is the file that spits out the archive links, etc. If found in your template folder, it will be used instead of the standard pgm-auto_menu.php file. Added in v4.9 r32.<br />
<br />
==Pound Variables==<br />
'''Pound Variables:''' unique variables that tell Pro Edition where to place specific “client changeable” headers, Menu Display buttons, and automatic text menus within your layout. These are not case sensitive, and can be placed visually within your HTML editor as text, so long as they contain the pound sign. <br />
<br />
'''Note: Should be in all-caps!'''<br />
<br />
<nowiki>#CONTENT#</nowiki> - Tells the system where to display the table that will hold all the content created within the Pro Edition’s Page Editor.<br />
Note: User will not be able to manage page content unless this variables is placed somewhere in your html template file (i.e. index.html).<br />
<br />
<nowiki>#LOGO#</nowiki> - Replaced with data from "Template Manager > Template header line". Inserts an editable Header line that can be changed by the user via the Soholaunch Pro Edition's Template Manager feature.<br />
<br />
<span id="logo-alt"></span> <nowiki>#LOGO#-ALT</nowiki> Same as #LOGO# except #LOGO#-ALT only displays if a logo image is not specified for #LOGOIMG# . This allows template designers to create templates that can accommodate an image or text logo, but not both.<br />
<br />
<nowiki>#LOGOIMG#</nowiki> - Custom Logo variable added which inserts a logo which is chosen in the Template Manager Module.<br />
<br />
<nowiki>#SLOGAN#</nowiki> - Custom Logo variable added which inserts a company slogan or moto which is chosen in the Template Manager Module.<br />
<br />
===Menu systems===<br />
<br />
<nowiki>#HMAINS#</nowiki> - Main page links only, arranged horizontally (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#VMAINS#</nowiki> - Main page links only, arranged vertically (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#HSUBS#</nowiki> - Sub page links only, arranged horizontally (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#VSUBS#</nowiki> - Sub page links only, arranged vertically (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#TMENU#</nowiki> - Inserts a horizontal, text based menu system that matches the “setup” of the Main and Sub menu system as configured via the Menu Display feature. Typically used for footer links.<br />
<br />
*Ultra only <nowiki>#FLYOUTMENU#</nowiki> Inserts a horizontal menu with a flyout menu for subpages.<br />
<br />
*Ultra only <nowiki>#VFLYOUTMENU#</nowiki> Inserts a vertical menu with a flyout menu for subpages.<br />
<br />
<nowiki>#PAGENAME#</nowiki> - Replaces with name of current page (underscores converted into spaces).<br />
<br />
<nowiki>#PAGETITLE#</nowiki> - Unique page name. Replaced with text defined via Edit Pages > Page Properties > Page Title<br />
<br />
<nowiki>#USERSONLINE#</nowiki> - Replaced with the number of visitors currently browsing your website. This particular variable may be also be used within the Text Editor.<br />
<br />
<nowiki>#AUTODATESTAMP#</nowiki> - Replaced the current weekday, month, day, and year.<br />
<br />
<nowiki>#PROMOTXT1#/#PROMOTXT2#</nowiki> - Text variables added which inserts the first 255 characters of blog_data pulled from random blog_content entry (under special "Promo Box 1/2" blog categories)<br />
<br />
<nowiki>#PROMOHDR1#/#PROMOHDR2#</nowiki> - Promo entry title. Works with --- the blog_title associated with blog_content entry pulled for <nowiki>#PROMOTXT1#/#PROMOTXT2#</nowiki><br />
<br />
<nowiki>#NEWSBOX#</nowiki> - Newsbox variable added which inserts text arranged by date, blog_title, and if desired a few lines of blog_data.<br />
<br />
===Company Information===<br />
[[User:Ruben|Ruben]] 11:40, 22 May 2006 (CDT)<br />
Below are a list of BIZ tags which information is pulled from the Global settings area.<br />
<br />
contact information tags that can be used:<br />
<br />
<nowiki>#BIZ-DOMAIN#</nowiki> - Replaces with Domain name.<br />
<br />
<nowiki>#BIZ-COMPANY#</nowiki> - Replaces with Company name.<br />
<br />
<nowiki>#BIZ-ADDRESS1#</nowiki> - Replaces with 1st address line.<br />
<br />
<nowiki>#BIZ-ADDRESS2#</nowiki> - Replaces with 2nd address line.<br />
<br />
<nowiki>#BIZ-ZIP# </nowiki> - Replaces with zip code.<br />
<br />
<nowiki>#BIZ-CITY#</nowiki> - Replaces with City name.<br />
<br />
<nowiki>#BIZ-STATE#</nowiki> - Replaces with State name.<br />
<br />
<nowiki>#BIZ-COUNTRY#</nowiki> - Replaces with Country name.<br />
<br />
<nowiki>#BIZ-EMAIL#</nowiki> - Replaces with email address.<br />
<br />
<nowiki>#BIZ-PHONE#</nowiki> - Replaces with phone number.<br />
<br />
<nowiki>#BIZ-FAX#</nowiki> - Replaces with fax number.<br />
<br />
<nowiki>#COPYRIGHT#</nowiki> -Replaced with copyright text from global settings, prefixed with the copyright symbol &copy;<br />
<br />
===Custom script includes===<br />
====<nowiki>#CUSTOMINC#</nowiki>====<br />
Replaced with output of "includethis.inc" (if found), which should be placed in the template's folder along with index.html, custom.css, etc.<br />
<br />
====<nowiki>#CUSTOMINC2#</nowiki>====<br />
Replaced with output of "includethis2.inc" (if found), which should be placed in the template's folder along with index.html, custom.css, etc<br />
<br />
====<nowiki><!---#INC-myfile.php#--></nowiki>====<br />
Initiates php call to include("myfile.php"). Note that the pound variable itself is not actually replaced in the template html when this happens, which is it should be contained within an HTML comment tag. Include file (i.e. myfile.php) should be in your template folder.<br />
<br />
====<nowiki>#OUTPUT-myfile.php#</nowiki>====<br />
Replaced with the ''output'' of file you specify (i.e. myfile.php). Include file (i.e. myfile.php) should be in your template folder.This is what you should use if you want your custom include file to dynamically build some html and spit it out at certain place in the template html (or similiar situation). This is also handy for pulling in javascript functions that have php-created pieces to them.<br />
<br />
===Other/Misc===<br />
====<nowiki>#BOX1# - #BOX8#</nowiki>====<br />
Adding #BOX1# to a template is similar to #NEWSBOX# but gives the user much more control within the Template Manager in the Box Manager.<br />
<br />
Once a template with this variable is selected in the template manager, the option to modify #BOX# display settings will become available within the Template Features area.<br />
<br />
====<nowiki>#BOX-TITLE1# - #BOX-TITLE8#</nowiki>====<br />
Adding #BOX-TITLE1# to a template allows the user to change a box title within the Box Manager.<br />
<br />
====<nowiki>#JQUERY# (Ultra Only)</nowiki>====<br />
Placing #JQUERY# into the template's index.html/.php file adds the latest stable version of the jQuery library. This enables your template to use jQuery if you are using the library as part of your development. It works whether you're referencing an external javascript file or using jQuery directly on the index page.<br />
<br />
====<nowiki>#template_folder#</nowiki>====<br />
Replaced with folder name of template assigned to page currently being viewied. Added so plugin/template developers can know the current template folder for image paths, etc.<br />
<br />
''Example value of #template_folder#:'' <br />
<br />
ANIMALS-Kittens_Awww-Cute_Blue.<br />
<br />
*Ultra only ====<nowiki>#relative_template_path#</nowiki>==== Replaced with relative path from document root foler.<br />
''Example value of #relative_template_path#:'' <br />
sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
====<nowiki>#template_path#</nowiki>====<br />
Replaced with full server path from root, up to and including folder name of template assigned to page currently being viewied. <br />
<br />
''Example value of #template_path#:'' <br />
/home/sites/example.com/sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
Added so plugin developers can know the current template folder for script include paths and such.<br />
<br />
====<nowiki>#template_path_full_url#</nowiki>==== - Replaced with absolute url path to template folder, accounts for http/https, helps with image src's and such.<br />
<br />
''Example value of #template_path_full_url#:'' <br />
<br />
http://example.com/sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
====<nowiki>#plugin-[whatever]#</nowiki>==== <br />
- Put #plugin-[whatever]# pound variable(s) in your custom templates to designate areas designed to work with a specific plugin (that when installed will replace that var with it's own content). <br />
<br />
All remaining (unreplaced by a plugin) #plugin-[whatever]# tags will be stripped from template html before final page content displays. That way if the plugin that works with a given #plugin-[whatever]# var is not installed, you won't see a bunch of raw #plugin-[whatever]#'s all over the template when the site is viewed.<br />
<br />
'''Example usage''' <br />
Let's say somebody develops a plugin called "Say Hello World 1.0" that as one of it's features searches for #pound-helloworld# within the template html and replaces it with the text "Hello World".<br />
<br />
Template developers who wish to make their templates more appealing by accommadating people who use the "Say Hello World 1.0" plugin can stick #pound-helloworld# in their template in some special place and not have to worry about the raw "#pound-helloworld#" pound var text displaying on sites where the "Say Hello World 1.0" plugin is NOT installed because if the plugin's not installed that pound var text will be simply stripped from the output html before the site page is loaded.<br />
<br />
==User Images==<br />
[[Image:Tman-template images.gif|thumb|When user selects a template in Template Manager that uses image files with the _userimg- prefix he is given access to the Template Images feature]]<br />
[[Image:Template_images.gif|thumb|Template Images feature allows user to swap out certain template images (any template image with a _userimg- prefix) with his own images]]<br />
One of the top modification requests from purchases of custom templates is "Can you change that one image to something else?". This is what the Template Images feature was designed to address. <br />
<br />
You can give the user control over any image in your template by prefixing the image's file name with "_userimg-", like so...<br />
<img src="_userimg-template_header.jpg"><br />
<br />
===All you have to do is name the file right===<br />
As the template developer, all you have to worry about is naming your image files with that _userimg- prefix. The Soholaunch tool will take care of the rest.<br />
<br />
The system only needs the right image filename to detect that a particular image should be user-controllable. It doesn't matter where or how you use the image in your template html. It could be a background image assigned via a css in rule, it could be a normal image tag...whatever.<br />
<br />
'''Note: Image must be called in your template html file. Will not work with image calls in separate custom.css file. So if you have css rules that you want to use the _userimg- thing with, put them directly in your template html using <style> tags.'''<br />
<br />
===Code Examples - Any image can be a user image===<br />
The following are just a few examples of how you could utilize the _userimg- functionality.<br />
<br />
You could let them change the header background image defined in your css rules...<br />
<pre><br />
#header {<br />
background-image: url('_userimg-header_bg.gif');<br />
}<br />
</pre><br />
<br />
Or maybe the menu background pattern defined via inline css...<br />
<pre><br />
<div id="vmenu" style="background-image: url('_userimg-vmenu_bg.gif');repeat: repeat-y;"><br />
#vmenu#<br />
</div><br />
</pre><br />
<br />
Or maybe you have an image of a semi truck in your home page splash template (home.html) and you want the template to be easily used for other industry applications...<br />
<pre><br />
<img src="_userimg-semi_truck.jpg"/><br />
</pre><br />
<br />
The point is: You can make any image in your template controllable by the user as long as you give the image file that _userimg- prefix.<br />
<br />
==Uploading custom templates==<br />
If you're running v4.8.5 or later...<br />
Zip up your Template Folder and Files and upload the .zip file via Template Manager > Upload Custom Template (below Base Site Template selection). Once uploaded the product will automatically extract your .zip file in the correct location, and the template will be availible in the list of templates (drop-downs and browse by screenshot).<br />
<br />
If you're running a version prior to v4.8.5, or if you want to quickly update individual template files...<br />
Log-in to your site via FTP and upload your template folder (containing all template files) to this folder:<br />
<pre><br />
sohoadmin/program/modules/site_templates/pages<br />
</pre><br />
<br />
==Hard-coded page links==<br />
When using custom navigation elements, you will need to know how to code various links. Since the entire site created within the product platform is database-driven, it is necessary to call pages differently than when coding for traditional HTML pages. Theses links must be added inside the template file.<br />
<br />
Normal Page Links<br />
<br />
Let’s say that you have created a navigation button that should be linked to the “About Us” Page. The following code is what should be used to link your navigation element:<br />
<br />
index.php?pr=About_Us<br />
<br />
Note: '''The page name is case sensitive''' and page name must be accurately depicted for proper operation. Notice that all spaces between words in the page names are separated by an underscore. This must be manually coded in place of spaces for the link to work properly.<br />
<br />
The actual page name is directly related to the page name created within the “Create Pages” module of the Soholaunch Pro Edition.<br />
<br />
Because your site is database driven, you will always call the “index.php” file when linking to normal site pages, like so...<br />
<pre>http://example.com/index.php?pr=Home_Page</pre><br />
<br />
And thanks to recent upgrades to make Soholaunch-created website more SEO-friendly, you can also link to the .php file that is automatically created for each site page, like so...<br />
<pre>http://example.com/Home_Page.php</pre><br />
<br />
'''Note:''' Don't hard-code menu links if you're planning to sell your template on the Addons site. This option is only recommended if you're building a template for a specific site only and you know exactly what links will be on the menu and that they're not going to change much. But even in those cases it'll usually be easier for you in the long run to use the Menu Navigation system, even if heavily-modified, because at some point you're almost certainly going to want to add, reorder, or remove menu links... better to make that process as easy as clicking a couple buttons in Pro Edition's Menu Navigation feature.</nowiki></div>Sohohttps://wiki.soholaunch.com/index.php?title=Custom_Template_ReferenceCustom Template Reference2014-02-03T18:16:57Z<p>Soho: /* #JQUERY# */</p>
<hr />
<div>[[Category:Templates]]<br />
<br />
==Download .zip how-to package with PDF tutorial==<br />
Want to learn how to create your own templates for Pro Edition? [https://addons.soholaunch.com/media/Creating_Custom_Template_for_SOHO.zip Download this great how-to article] (with example files!) written by Soholaunch customer Jaun-Vincent Haasbroek.<br />
<br />
==Introduction==<br />
This section covers the creation and integration of custom templates for use with the Soholaunch Pro Edition, and is intended for graphic designers and site developers. As such, a working knowledge of Adobe Photoshop and HTML programming is recommended.<br />
<br />
===How Pro Edition interprets template information===<br />
Within the maintenance platform, users will only have access to the page “content” area for editing. This means that each site must have a template design that maintains continuity throughout the site. Automatic menu generation is built in to the Soholaunch management tool so that Menu Display buttons and sub-page buttons can be defined within the template (using special Pound Variables). This gives you the option of placing Menu Display systems vertically, on the left or right of the page layout, or horizontally, across the top or bottom of your pages.<br />
<br />
You may also wish to custom-design your main navigation system and not use the Menu Display feature at all. This allows you to have total control over font, colors and sizes of your navigation structure. For even greater flexibility in design, different templates may be assigned to individual site pages throughout your site.<br />
<br />
Your template designs can take on any level of complexity that you wish them to have. However, please note that the user, via the management tool, cannot change any images, text, or links built into the template. This should always be planned and noted well ahead of the build process.<br />
<br />
==Template folder and files==<br />
Place all files(images,index.html,custom.css, etc) into a folder and name the folder like this...<br />
<pre><br />
Category-Sub_Category-Color<br />
<br />
Example: Category-Template_Name-Color<br />
</pre><br />
<br />
Possible files in your template folder (aside from images):<br />
<br />
'''index.html''' (REQUIRED) - The main HTML template file for your website used accross all site pages. This file must exist in your template folder in order for site pages to display at all.<br />
<br />
'''cart.html''' (OPTIONAL) - Custom shopping cart template. If found in your template folder, it will be used in place of index.html on shopping cart system pages (as in: when website visitor is browsing/purchasing products via your online checkout process).<br />
<br />
'''home.html''' (OPTIONAL) - If found in your template folder, it will be used in place of index.html on the "Home Page" (whatever page you've assigned to be your start/index/home/default page).<br />
<br />
'''news.html''' (OPTIONAL) - Custom blog/article display template. If found in your template folder, it will be used in place of index.html when visitor views full text of blog entry or news item.<br />
<br />
'''custom.css''' (OPTIONAL) - If found in your template folder, it will be used in place of the default stylesheet (runtime.css).<br />
<br />
'''cart.css''' (OPTIONAL) - If found in your template folder, it will be used in place of the default stylesheet (runtime.css) on shopping cart system pages. This is mainly usefull in conjunction with cart.html. That way you can have a separate template html file as well as a separate style sheet for shopping cart system pages.<br />
<br />
'''[[Modifying_cart_system_styles|shopping_cart.css]]''' (OPTIONAL) - If found in your template folder, will be included instead of pulling the colors/styles set in Shopping Cart > Display Settings. Note that this performs a completely different function than cart.css.<br />
<br />
'''template_variable_rules.php''' (OPTIONAL) - If found in your template folder, it will be included within pgm-realtime_builder.php right before all of the other #variables# are processed, allowing your template to use custom pound variables <br />
and even override standard pound variable functionality if you want to.<br />
<br />
===Source file overrides===<br />
'''pgm-auto_menu.php''' (OPTIONAL) - This is the file that puts together the html output for the various menu navigation systems (vmenu, hmains, etc) when your website is viewed. If found in your template folder, it will be used instead of the standard pgm-auto_menu.php file. The idea here it to download the original pgm-auto_menu.php from your docroot or from sohoadmin/client_files/base_files (same file, 2 locations), make a copy of it and stick it in your template folder, then modify it to all kinds of crazy things with your menu system.<br />
<br />
'''pgm-faq_display.php''' (OPTIONAL) - When a visitor views a page with FAQs on it, this file is called to build the HTML output for the FAQs. If you make a copy of this file and stick it in your template folder, your (presumably modified) copy will be used instead of the standard file. Do this when you want to trick out how your FAQs display, [http://info.soholaunch.com/Support.php like Soholaunch did on our main website] --- links to the support page, scroll down to see FAQs...we added those big 'Q' graphics and customized the font.<br />
<br />
'''pgm-promo_boxes.php''' (OPTIONAL) - When a visitor views a page whose template uses #NEWSBOX#, #BOX1#, etc, this file is called to build the HTML output for the news/promo boxes. If you make a copy of this file and stick it in your template folder, your (presumably modified) copy will be used instead of the standard file. Do this when you want to trick out how your news/promo boxes display further than you can via the Template Box Manager. Literally unlimited modification potential here.<br />
<br />
'''pgm-blog_display.php''' (OPTION) - Called when visitor views a page with a blog dropped on it. This is the file that spits out the archive links, etc. If found in your template folder, it will be used instead of the standard pgm-auto_menu.php file. Added in v4.9 r32.<br />
<br />
==Pound Variables==<br />
'''Pound Variables:''' unique variables that tell Pro Edition where to place specific “client changeable” headers, Menu Display buttons, and automatic text menus within your layout. These are not case sensitive, and can be placed visually within your HTML editor as text, so long as they contain the pound sign. <br />
<br />
'''Note: Should be in all-caps!'''<br />
<br />
<nowiki>#CONTENT#</nowiki> - Tells the system where to display the table that will hold all the content created within the Pro Edition’s Page Editor.<br />
Note: User will not be able to manage page content unless this variables is placed somewhere in your html template file (i.e. index.html).<br />
<br />
<nowiki>#LOGO#</nowiki> - Replaced with data from "Template Manager > Template header line". Inserts an editable Header line that can be changed by the user via the Soholaunch Pro Edition's Template Manager feature.<br />
<br />
<span id="logo-alt"></span> <nowiki>#LOGO#-ALT</nowiki> Same as #LOGO# except #LOGO#-ALT only displays if a logo image is not specified for #LOGOIMG# . This allows template designers to create templates that can accommodate an image or text logo, but not both.<br />
<br />
<nowiki>#LOGOIMG#</nowiki> - Custom Logo variable added which inserts a logo which is chosen in the Template Manager Module.<br />
<br />
<nowiki>#SLOGAN#</nowiki> - Custom Logo variable added which inserts a company slogan or moto which is chosen in the Template Manager Module.<br />
<br />
===Menu systems===<br />
<br />
<nowiki>#HMAINS#</nowiki> - Main page links only, arranged horizontally (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#VMAINS#</nowiki> - Main page links only, arranged vertically (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#HSUBS#</nowiki> - Sub page links only, arranged horizontally (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#VSUBS#</nowiki> - Sub page links only, arranged vertically (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#TMENU#</nowiki> - Inserts a horizontal, text based menu system that matches the “setup” of the Main and Sub menu system as configured via the Menu Display feature. Typically used for footer links.<br />
<br />
*Ultra only <nowiki>#FLYOUTMENU#</nowiki> Inserts a horizontal menu with a flyout menu for subpages.<br />
<br />
*Ultra only <nowiki>#VFLYOUTMENU#</nowiki> Inserts a vertical menu with a flyout menu for subpages.<br />
<br />
<nowiki>#PAGENAME#</nowiki> - Replaces with name of current page (underscores converted into spaces).<br />
<br />
<nowiki>#PAGETITLE#</nowiki> - Unique page name. Replaced with text defined via Edit Pages > Page Properties > Page Title<br />
<br />
<nowiki>#USERSONLINE#</nowiki> - Replaced with the number of visitors currently browsing your website. This particular variable may be also be used within the Text Editor.<br />
<br />
<nowiki>#AUTODATESTAMP#</nowiki> - Replaced the current weekday, month, day, and year.<br />
<br />
<nowiki>#PROMOTXT1#/#PROMOTXT2#</nowiki> - Text variables added which inserts the first 255 characters of blog_data pulled from random blog_content entry (under special "Promo Box 1/2" blog categories)<br />
<br />
<nowiki>#PROMOHDR1#/#PROMOHDR2#</nowiki> - Promo entry title. Works with --- the blog_title associated with blog_content entry pulled for <nowiki>#PROMOTXT1#/#PROMOTXT2#</nowiki><br />
<br />
<nowiki>#NEWSBOX#</nowiki> - Newsbox variable added which inserts text arranged by date, blog_title, and if desired a few lines of blog_data.<br />
<br />
===Company Information===<br />
[[User:Ruben|Ruben]] 11:40, 22 May 2006 (CDT)<br />
Below are a list of BIZ tags which information is pulled from the Global settings area.<br />
<br />
contact information tags that can be used:<br />
<br />
<nowiki>#BIZ-DOMAIN#</nowiki> - Replaces with Domain name.<br />
<br />
<nowiki>#BIZ-COMPANY#</nowiki> - Replaces with Company name.<br />
<br />
<nowiki>#BIZ-ADDRESS1#</nowiki> - Replaces with 1st address line.<br />
<br />
<nowiki>#BIZ-ADDRESS2#</nowiki> - Replaces with 2nd address line.<br />
<br />
<nowiki>#BIZ-ZIP# </nowiki> - Replaces with zip code.<br />
<br />
<nowiki>#BIZ-CITY#</nowiki> - Replaces with City name.<br />
<br />
<nowiki>#BIZ-STATE#</nowiki> - Replaces with State name.<br />
<br />
<nowiki>#BIZ-COUNTRY#</nowiki> - Replaces with Country name.<br />
<br />
<nowiki>#BIZ-EMAIL#</nowiki> - Replaces with email address.<br />
<br />
<nowiki>#BIZ-PHONE#</nowiki> - Replaces with phone number.<br />
<br />
<nowiki>#BIZ-FAX#</nowiki> - Replaces with fax number.<br />
<br />
<nowiki>#COPYRIGHT#</nowiki> -Replaced with copyright text from global settings, prefixed with the copyright symbol &copy;<br />
<br />
===Custom script includes===<br />
====<nowiki>#CUSTOMINC#</nowiki>====<br />
Replaced with output of "includethis.inc" (if found), which should be placed in the template's folder along with index.html, custom.css, etc.<br />
<br />
====<nowiki>#CUSTOMINC2#</nowiki>====<br />
Replaced with output of "includethis2.inc" (if found), which should be placed in the template's folder along with index.html, custom.css, etc<br />
<br />
====<nowiki><!---#INC-myfile.php#--></nowiki>====<br />
Initiates php call to include("myfile.php"). Note that the pound variable itself is not actually replaced in the template html when this happens, which is it should be contained within an HTML comment tag. Include file (i.e. myfile.php) should be in your template folder.<br />
<br />
====<nowiki>#OUTPUT-myfile.php#</nowiki>====<br />
Replaced with the ''output'' of file you specify (i.e. myfile.php). Include file (i.e. myfile.php) should be in your template folder.This is what you should use if you want your custom include file to dynamically build some html and spit it out at certain place in the template html (or similiar situation). This is also handy for pulling in javascript functions that have php-created pieces to them.<br />
<br />
===Other/Misc===<br />
====<nowiki>#BOX1# - #BOX8#</nowiki>====<br />
Adding #BOX1# to a template is similar to #NEWSBOX# but gives the user much more control within the Template Manager in the Box Manager.<br />
<br />
Once a template with this variable is selected in the template manager, the option to modify #BOX# display settings will become available within the Template Features area.<br />
<br />
====<nowiki>#BOX-TITLE1# - #BOX-TITLE8#</nowiki>====<br />
Adding #BOX-TITLE1# to a template allows the user to change a box title within the Box Manager.<br />
<br />
====<nowiki>#JQUERY# (Ultra Only)</nowiki>====<br />
Placing #JQUERY# into the template's index.html/.php file adds the latest stable version of the jQuery library. This enables your template to use jQuery if you are using the library as part of your development. It works whether you referencing an external javascript file or using jQuery directly on the index page.<br />
<br />
====<nowiki>#template_folder#</nowiki>====<br />
Replaced with folder name of template assigned to page currently being viewied. Added so plugin/template developers can know the current template folder for image paths, etc.<br />
<br />
''Example value of #template_folder#:'' <br />
<br />
ANIMALS-Kittens_Awww-Cute_Blue.<br />
<br />
*Ultra only ====<nowiki>#relative_template_path#</nowiki>==== Replaced with relative path from document root foler.<br />
''Example value of #relative_template_path#:'' <br />
sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
====<nowiki>#template_path#</nowiki>====<br />
Replaced with full server path from root, up to and including folder name of template assigned to page currently being viewied. <br />
<br />
''Example value of #template_path#:'' <br />
/home/sites/example.com/sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
Added so plugin developers can know the current template folder for script include paths and such.<br />
<br />
====<nowiki>#template_path_full_url#</nowiki>==== - Replaced with absolute url path to template folder, accounts for http/https, helps with image src's and such.<br />
<br />
''Example value of #template_path_full_url#:'' <br />
<br />
http://example.com/sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
====<nowiki>#plugin-[whatever]#</nowiki>==== <br />
- Put #plugin-[whatever]# pound variable(s) in your custom templates to designate areas designed to work with a specific plugin (that when installed will replace that var with it's own content). <br />
<br />
All remaining (unreplaced by a plugin) #plugin-[whatever]# tags will be stripped from template html before final page content displays. That way if the plugin that works with a given #plugin-[whatever]# var is not installed, you won't see a bunch of raw #plugin-[whatever]#'s all over the template when the site is viewed.<br />
<br />
'''Example usage''' <br />
Let's say somebody develops a plugin called "Say Hello World 1.0" that as one of it's features searches for #pound-helloworld# within the template html and replaces it with the text "Hello World".<br />
<br />
Template developers who wish to make their templates more appealing by accommadating people who use the "Say Hello World 1.0" plugin can stick #pound-helloworld# in their template in some special place and not have to worry about the raw "#pound-helloworld#" pound var text displaying on sites where the "Say Hello World 1.0" plugin is NOT installed because if the plugin's not installed that pound var text will be simply stripped from the output html before the site page is loaded.<br />
<br />
==User Images==<br />
[[Image:Tman-template images.gif|thumb|When user selects a template in Template Manager that uses image files with the _userimg- prefix he is given access to the Template Images feature]]<br />
[[Image:Template_images.gif|thumb|Template Images feature allows user to swap out certain template images (any template image with a _userimg- prefix) with his own images]]<br />
One of the top modification requests from purchases of custom templates is "Can you change that one image to something else?". This is what the Template Images feature was designed to address. <br />
<br />
You can give the user control over any image in your template by prefixing the image's file name with "_userimg-", like so...<br />
<img src="_userimg-template_header.jpg"><br />
<br />
===All you have to do is name the file right===<br />
As the template developer, all you have to worry about is naming your image files with that _userimg- prefix. The Soholaunch tool will take care of the rest.<br />
<br />
The system only needs the right image filename to detect that a particular image should be user-controllable. It doesn't matter where or how you use the image in your template html. It could be a background image assigned via a css in rule, it could be a normal image tag...whatever.<br />
<br />
'''Note: Image must be called in your template html file. Will not work with image calls in separate custom.css file. So if you have css rules that you want to use the _userimg- thing with, put them directly in your template html using <style> tags.'''<br />
<br />
===Code Examples - Any image can be a user image===<br />
The following are just a few examples of how you could utilize the _userimg- functionality.<br />
<br />
You could let them change the header background image defined in your css rules...<br />
<pre><br />
#header {<br />
background-image: url('_userimg-header_bg.gif');<br />
}<br />
</pre><br />
<br />
Or maybe the menu background pattern defined via inline css...<br />
<pre><br />
<div id="vmenu" style="background-image: url('_userimg-vmenu_bg.gif');repeat: repeat-y;"><br />
#vmenu#<br />
</div><br />
</pre><br />
<br />
Or maybe you have an image of a semi truck in your home page splash template (home.html) and you want the template to be easily used for other industry applications...<br />
<pre><br />
<img src="_userimg-semi_truck.jpg"/><br />
</pre><br />
<br />
The point is: You can make any image in your template controllable by the user as long as you give the image file that _userimg- prefix.<br />
<br />
==Uploading custom templates==<br />
If you're running v4.8.5 or later...<br />
Zip up your Template Folder and Files and upload the .zip file via Template Manager > Upload Custom Template (below Base Site Template selection). Once uploaded the product will automatically extract your .zip file in the correct location, and the template will be availible in the list of templates (drop-downs and browse by screenshot).<br />
<br />
If you're running a version prior to v4.8.5, or if you want to quickly update individual template files...<br />
Log-in to your site via FTP and upload your template folder (containing all template files) to this folder:<br />
<pre><br />
sohoadmin/program/modules/site_templates/pages<br />
</pre><br />
<br />
==Hard-coded page links==<br />
When using custom navigation elements, you will need to know how to code various links. Since the entire site created within the product platform is database-driven, it is necessary to call pages differently than when coding for traditional HTML pages. Theses links must be added inside the template file.<br />
<br />
Normal Page Links<br />
<br />
Let’s say that you have created a navigation button that should be linked to the “About Us” Page. The following code is what should be used to link your navigation element:<br />
<br />
index.php?pr=About_Us<br />
<br />
Note: '''The page name is case sensitive''' and page name must be accurately depicted for proper operation. Notice that all spaces between words in the page names are separated by an underscore. This must be manually coded in place of spaces for the link to work properly.<br />
<br />
The actual page name is directly related to the page name created within the “Create Pages” module of the Soholaunch Pro Edition.<br />
<br />
Because your site is database driven, you will always call the “index.php” file when linking to normal site pages, like so...<br />
<pre>http://example.com/index.php?pr=Home_Page</pre><br />
<br />
And thanks to recent upgrades to make Soholaunch-created website more SEO-friendly, you can also link to the .php file that is automatically created for each site page, like so...<br />
<pre>http://example.com/Home_Page.php</pre><br />
<br />
'''Note:''' Don't hard-code menu links if you're planning to sell your template on the Addons site. This option is only recommended if you're building a template for a specific site only and you know exactly what links will be on the menu and that they're not going to change much. But even in those cases it'll usually be easier for you in the long run to use the Menu Navigation system, even if heavily-modified, because at some point you're almost certainly going to want to add, reorder, or remove menu links... better to make that process as easy as clicking a couple buttons in Pro Edition's Menu Navigation feature.</nowiki></div>Sohohttps://wiki.soholaunch.com/index.php?title=Custom_Template_ReferenceCustom Template Reference2014-02-03T18:08:34Z<p>Soho: /* #JQUERY# (ULTRA ONLY) */</p>
<hr />
<div>[[Category:Templates]]<br />
<br />
==Download .zip how-to package with PDF tutorial==<br />
Want to learn how to create your own templates for Pro Edition? [https://addons.soholaunch.com/media/Creating_Custom_Template_for_SOHO.zip Download this great how-to article] (with example files!) written by Soholaunch customer Jaun-Vincent Haasbroek.<br />
<br />
==Introduction==<br />
This section covers the creation and integration of custom templates for use with the Soholaunch Pro Edition, and is intended for graphic designers and site developers. As such, a working knowledge of Adobe Photoshop and HTML programming is recommended.<br />
<br />
===How Pro Edition interprets template information===<br />
Within the maintenance platform, users will only have access to the page “content” area for editing. This means that each site must have a template design that maintains continuity throughout the site. Automatic menu generation is built in to the Soholaunch management tool so that Menu Display buttons and sub-page buttons can be defined within the template (using special Pound Variables). This gives you the option of placing Menu Display systems vertically, on the left or right of the page layout, or horizontally, across the top or bottom of your pages.<br />
<br />
You may also wish to custom-design your main navigation system and not use the Menu Display feature at all. This allows you to have total control over font, colors and sizes of your navigation structure. For even greater flexibility in design, different templates may be assigned to individual site pages throughout your site.<br />
<br />
Your template designs can take on any level of complexity that you wish them to have. However, please note that the user, via the management tool, cannot change any images, text, or links built into the template. This should always be planned and noted well ahead of the build process.<br />
<br />
==Template folder and files==<br />
Place all files(images,index.html,custom.css, etc) into a folder and name the folder like this...<br />
<pre><br />
Category-Sub_Category-Color<br />
<br />
Example: Category-Template_Name-Color<br />
</pre><br />
<br />
Possible files in your template folder (aside from images):<br />
<br />
'''index.html''' (REQUIRED) - The main HTML template file for your website used accross all site pages. This file must exist in your template folder in order for site pages to display at all.<br />
<br />
'''cart.html''' (OPTIONAL) - Custom shopping cart template. If found in your template folder, it will be used in place of index.html on shopping cart system pages (as in: when website visitor is browsing/purchasing products via your online checkout process).<br />
<br />
'''home.html''' (OPTIONAL) - If found in your template folder, it will be used in place of index.html on the "Home Page" (whatever page you've assigned to be your start/index/home/default page).<br />
<br />
'''news.html''' (OPTIONAL) - Custom blog/article display template. If found in your template folder, it will be used in place of index.html when visitor views full text of blog entry or news item.<br />
<br />
'''custom.css''' (OPTIONAL) - If found in your template folder, it will be used in place of the default stylesheet (runtime.css).<br />
<br />
'''cart.css''' (OPTIONAL) - If found in your template folder, it will be used in place of the default stylesheet (runtime.css) on shopping cart system pages. This is mainly usefull in conjunction with cart.html. That way you can have a separate template html file as well as a separate style sheet for shopping cart system pages.<br />
<br />
'''[[Modifying_cart_system_styles|shopping_cart.css]]''' (OPTIONAL) - If found in your template folder, will be included instead of pulling the colors/styles set in Shopping Cart > Display Settings. Note that this performs a completely different function than cart.css.<br />
<br />
'''template_variable_rules.php''' (OPTIONAL) - If found in your template folder, it will be included within pgm-realtime_builder.php right before all of the other #variables# are processed, allowing your template to use custom pound variables <br />
and even override standard pound variable functionality if you want to.<br />
<br />
===Source file overrides===<br />
'''pgm-auto_menu.php''' (OPTIONAL) - This is the file that puts together the html output for the various menu navigation systems (vmenu, hmains, etc) when your website is viewed. If found in your template folder, it will be used instead of the standard pgm-auto_menu.php file. The idea here it to download the original pgm-auto_menu.php from your docroot or from sohoadmin/client_files/base_files (same file, 2 locations), make a copy of it and stick it in your template folder, then modify it to all kinds of crazy things with your menu system.<br />
<br />
'''pgm-faq_display.php''' (OPTIONAL) - When a visitor views a page with FAQs on it, this file is called to build the HTML output for the FAQs. If you make a copy of this file and stick it in your template folder, your (presumably modified) copy will be used instead of the standard file. Do this when you want to trick out how your FAQs display, [http://info.soholaunch.com/Support.php like Soholaunch did on our main website] --- links to the support page, scroll down to see FAQs...we added those big 'Q' graphics and customized the font.<br />
<br />
'''pgm-promo_boxes.php''' (OPTIONAL) - When a visitor views a page whose template uses #NEWSBOX#, #BOX1#, etc, this file is called to build the HTML output for the news/promo boxes. If you make a copy of this file and stick it in your template folder, your (presumably modified) copy will be used instead of the standard file. Do this when you want to trick out how your news/promo boxes display further than you can via the Template Box Manager. Literally unlimited modification potential here.<br />
<br />
'''pgm-blog_display.php''' (OPTION) - Called when visitor views a page with a blog dropped on it. This is the file that spits out the archive links, etc. If found in your template folder, it will be used instead of the standard pgm-auto_menu.php file. Added in v4.9 r32.<br />
<br />
==Pound Variables==<br />
'''Pound Variables:''' unique variables that tell Pro Edition where to place specific “client changeable” headers, Menu Display buttons, and automatic text menus within your layout. These are not case sensitive, and can be placed visually within your HTML editor as text, so long as they contain the pound sign. <br />
<br />
'''Note: Should be in all-caps!'''<br />
<br />
<nowiki>#CONTENT#</nowiki> - Tells the system where to display the table that will hold all the content created within the Pro Edition’s Page Editor.<br />
Note: User will not be able to manage page content unless this variables is placed somewhere in your html template file (i.e. index.html).<br />
<br />
<nowiki>#LOGO#</nowiki> - Replaced with data from "Template Manager > Template header line". Inserts an editable Header line that can be changed by the user via the Soholaunch Pro Edition's Template Manager feature.<br />
<br />
<span id="logo-alt"></span> <nowiki>#LOGO#-ALT</nowiki> Same as #LOGO# except #LOGO#-ALT only displays if a logo image is not specified for #LOGOIMG# . This allows template designers to create templates that can accommodate an image or text logo, but not both.<br />
<br />
<nowiki>#LOGOIMG#</nowiki> - Custom Logo variable added which inserts a logo which is chosen in the Template Manager Module.<br />
<br />
<nowiki>#SLOGAN#</nowiki> - Custom Logo variable added which inserts a company slogan or moto which is chosen in the Template Manager Module.<br />
<br />
===Menu systems===<br />
<br />
<nowiki>#HMAINS#</nowiki> - Main page links only, arranged horizontally (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#VMAINS#</nowiki> - Main page links only, arranged vertically (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#HSUBS#</nowiki> - Sub page links only, arranged horizontally (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#VSUBS#</nowiki> - Sub page links only, arranged vertically (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#TMENU#</nowiki> - Inserts a horizontal, text based menu system that matches the “setup” of the Main and Sub menu system as configured via the Menu Display feature. Typically used for footer links.<br />
<br />
*Ultra only <nowiki>#FLYOUTMENU#</nowiki> Inserts a horizontal menu with a flyout menu for subpages.<br />
<br />
*Ultra only <nowiki>#VFLYOUTMENU#</nowiki> Inserts a vertical menu with a flyout menu for subpages.<br />
<br />
<nowiki>#PAGENAME#</nowiki> - Replaces with name of current page (underscores converted into spaces).<br />
<br />
<nowiki>#PAGETITLE#</nowiki> - Unique page name. Replaced with text defined via Edit Pages > Page Properties > Page Title<br />
<br />
<nowiki>#USERSONLINE#</nowiki> - Replaced with the number of visitors currently browsing your website. This particular variable may be also be used within the Text Editor.<br />
<br />
<nowiki>#AUTODATESTAMP#</nowiki> - Replaced the current weekday, month, day, and year.<br />
<br />
<nowiki>#PROMOTXT1#/#PROMOTXT2#</nowiki> - Text variables added which inserts the first 255 characters of blog_data pulled from random blog_content entry (under special "Promo Box 1/2" blog categories)<br />
<br />
<nowiki>#PROMOHDR1#/#PROMOHDR2#</nowiki> - Promo entry title. Works with --- the blog_title associated with blog_content entry pulled for <nowiki>#PROMOTXT1#/#PROMOTXT2#</nowiki><br />
<br />
<nowiki>#NEWSBOX#</nowiki> - Newsbox variable added which inserts text arranged by date, blog_title, and if desired a few lines of blog_data.<br />
<br />
===Company Information===<br />
[[User:Ruben|Ruben]] 11:40, 22 May 2006 (CDT)<br />
Below are a list of BIZ tags which information is pulled from the Global settings area.<br />
<br />
contact information tags that can be used:<br />
<br />
<nowiki>#BIZ-DOMAIN#</nowiki> - Replaces with Domain name.<br />
<br />
<nowiki>#BIZ-COMPANY#</nowiki> - Replaces with Company name.<br />
<br />
<nowiki>#BIZ-ADDRESS1#</nowiki> - Replaces with 1st address line.<br />
<br />
<nowiki>#BIZ-ADDRESS2#</nowiki> - Replaces with 2nd address line.<br />
<br />
<nowiki>#BIZ-ZIP# </nowiki> - Replaces with zip code.<br />
<br />
<nowiki>#BIZ-CITY#</nowiki> - Replaces with City name.<br />
<br />
<nowiki>#BIZ-STATE#</nowiki> - Replaces with State name.<br />
<br />
<nowiki>#BIZ-COUNTRY#</nowiki> - Replaces with Country name.<br />
<br />
<nowiki>#BIZ-EMAIL#</nowiki> - Replaces with email address.<br />
<br />
<nowiki>#BIZ-PHONE#</nowiki> - Replaces with phone number.<br />
<br />
<nowiki>#BIZ-FAX#</nowiki> - Replaces with fax number.<br />
<br />
<nowiki>#COPYRIGHT#</nowiki> -Replaced with copyright text from global settings, prefixed with the copyright symbol &copy;<br />
<br />
===Custom script includes===<br />
====<nowiki>#CUSTOMINC#</nowiki>====<br />
Replaced with output of "includethis.inc" (if found), which should be placed in the template's folder along with index.html, custom.css, etc.<br />
<br />
====<nowiki>#CUSTOMINC2#</nowiki>====<br />
Replaced with output of "includethis2.inc" (if found), which should be placed in the template's folder along with index.html, custom.css, etc<br />
<br />
====<nowiki><!---#INC-myfile.php#--></nowiki>====<br />
Initiates php call to include("myfile.php"). Note that the pound variable itself is not actually replaced in the template html when this happens, which is it should be contained within an HTML comment tag. Include file (i.e. myfile.php) should be in your template folder.<br />
<br />
====<nowiki>#OUTPUT-myfile.php#</nowiki>====<br />
Replaced with the ''output'' of file you specify (i.e. myfile.php). Include file (i.e. myfile.php) should be in your template folder.This is what you should use if you want your custom include file to dynamically build some html and spit it out at certain place in the template html (or similiar situation). This is also handy for pulling in javascript functions that have php-created pieces to them.<br />
<br />
===Other/Misc===<br />
====<nowiki>#BOX1# - #BOX8#</nowiki>====<br />
Adding #BOX1# to a template is similar to #NEWSBOX# but gives the user much more control within the Template Manager in the Box Manager.<br />
<br />
Once a template with this variable is selected in the template manager, the option to modify #BOX# display settings will become available within the Template Features area.<br />
<br />
====<nowiki>#BOX-TITLE1# - #BOX-TITLE8#</nowiki>====<br />
Adding #BOX-TITLE1# to a template allows the user to change a box title within the Box Manager.<br />
<br />
====<nowiki>#JQUERY#</nowiki>====<br />
Placing #JQUERY# into the template's index.html/.php file adds the latest stable version of the jQuery library. This enables your template to use jQuery if you are using the library as part of your development. It works whether you referencing an external javascript file or using jQuery directly on the index page.<br />
<br />
====<nowiki>#template_folder#</nowiki>====<br />
Replaced with folder name of template assigned to page currently being viewied. Added so plugin/template developers can know the current template folder for image paths, etc.<br />
<br />
''Example value of #template_folder#:'' <br />
<br />
ANIMALS-Kittens_Awww-Cute_Blue.<br />
<br />
*Ultra only ====<nowiki>#relative_template_path#</nowiki>==== Replaced with relative path from document root foler.<br />
''Example value of #relative_template_path#:'' <br />
sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
====<nowiki>#template_path#</nowiki>====<br />
Replaced with full server path from root, up to and including folder name of template assigned to page currently being viewied. <br />
<br />
''Example value of #template_path#:'' <br />
/home/sites/example.com/sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
Added so plugin developers can know the current template folder for script include paths and such.<br />
<br />
====<nowiki>#template_path_full_url#</nowiki>==== - Replaced with absolute url path to template folder, accounts for http/https, helps with image src's and such.<br />
<br />
''Example value of #template_path_full_url#:'' <br />
<br />
http://example.com/sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
====<nowiki>#plugin-[whatever]#</nowiki>==== <br />
- Put #plugin-[whatever]# pound variable(s) in your custom templates to designate areas designed to work with a specific plugin (that when installed will replace that var with it's own content). <br />
<br />
All remaining (unreplaced by a plugin) #plugin-[whatever]# tags will be stripped from template html before final page content displays. That way if the plugin that works with a given #plugin-[whatever]# var is not installed, you won't see a bunch of raw #plugin-[whatever]#'s all over the template when the site is viewed.<br />
<br />
'''Example usage''' <br />
Let's say somebody develops a plugin called "Say Hello World 1.0" that as one of it's features searches for #pound-helloworld# within the template html and replaces it with the text "Hello World".<br />
<br />
Template developers who wish to make their templates more appealing by accommadating people who use the "Say Hello World 1.0" plugin can stick #pound-helloworld# in their template in some special place and not have to worry about the raw "#pound-helloworld#" pound var text displaying on sites where the "Say Hello World 1.0" plugin is NOT installed because if the plugin's not installed that pound var text will be simply stripped from the output html before the site page is loaded.<br />
<br />
==User Images==<br />
[[Image:Tman-template images.gif|thumb|When user selects a template in Template Manager that uses image files with the _userimg- prefix he is given access to the Template Images feature]]<br />
[[Image:Template_images.gif|thumb|Template Images feature allows user to swap out certain template images (any template image with a _userimg- prefix) with his own images]]<br />
One of the top modification requests from purchases of custom templates is "Can you change that one image to something else?". This is what the Template Images feature was designed to address. <br />
<br />
You can give the user control over any image in your template by prefixing the image's file name with "_userimg-", like so...<br />
<img src="_userimg-template_header.jpg"><br />
<br />
===All you have to do is name the file right===<br />
As the template developer, all you have to worry about is naming your image files with that _userimg- prefix. The Soholaunch tool will take care of the rest.<br />
<br />
The system only needs the right image filename to detect that a particular image should be user-controllable. It doesn't matter where or how you use the image in your template html. It could be a background image assigned via a css in rule, it could be a normal image tag...whatever.<br />
<br />
'''Note: Image must be called in your template html file. Will not work with image calls in separate custom.css file. So if you have css rules that you want to use the _userimg- thing with, put them directly in your template html using <style> tags.'''<br />
<br />
===Code Examples - Any image can be a user image===<br />
The following are just a few examples of how you could utilize the _userimg- functionality.<br />
<br />
You could let them change the header background image defined in your css rules...<br />
<pre><br />
#header {<br />
background-image: url('_userimg-header_bg.gif');<br />
}<br />
</pre><br />
<br />
Or maybe the menu background pattern defined via inline css...<br />
<pre><br />
<div id="vmenu" style="background-image: url('_userimg-vmenu_bg.gif');repeat: repeat-y;"><br />
#vmenu#<br />
</div><br />
</pre><br />
<br />
Or maybe you have an image of a semi truck in your home page splash template (home.html) and you want the template to be easily used for other industry applications...<br />
<pre><br />
<img src="_userimg-semi_truck.jpg"/><br />
</pre><br />
<br />
The point is: You can make any image in your template controllable by the user as long as you give the image file that _userimg- prefix.<br />
<br />
==Uploading custom templates==<br />
If you're running v4.8.5 or later...<br />
Zip up your Template Folder and Files and upload the .zip file via Template Manager > Upload Custom Template (below Base Site Template selection). Once uploaded the product will automatically extract your .zip file in the correct location, and the template will be availible in the list of templates (drop-downs and browse by screenshot).<br />
<br />
If you're running a version prior to v4.8.5, or if you want to quickly update individual template files...<br />
Log-in to your site via FTP and upload your template folder (containing all template files) to this folder:<br />
<pre><br />
sohoadmin/program/modules/site_templates/pages<br />
</pre><br />
<br />
==Hard-coded page links==<br />
When using custom navigation elements, you will need to know how to code various links. Since the entire site created within the product platform is database-driven, it is necessary to call pages differently than when coding for traditional HTML pages. Theses links must be added inside the template file.<br />
<br />
Normal Page Links<br />
<br />
Let’s say that you have created a navigation button that should be linked to the “About Us” Page. The following code is what should be used to link your navigation element:<br />
<br />
index.php?pr=About_Us<br />
<br />
Note: '''The page name is case sensitive''' and page name must be accurately depicted for proper operation. Notice that all spaces between words in the page names are separated by an underscore. This must be manually coded in place of spaces for the link to work properly.<br />
<br />
The actual page name is directly related to the page name created within the “Create Pages” module of the Soholaunch Pro Edition.<br />
<br />
Because your site is database driven, you will always call the “index.php” file when linking to normal site pages, like so...<br />
<pre>http://example.com/index.php?pr=Home_Page</pre><br />
<br />
And thanks to recent upgrades to make Soholaunch-created website more SEO-friendly, you can also link to the .php file that is automatically created for each site page, like so...<br />
<pre>http://example.com/Home_Page.php</pre><br />
<br />
'''Note:''' Don't hard-code menu links if you're planning to sell your template on the Addons site. This option is only recommended if you're building a template for a specific site only and you know exactly what links will be on the menu and that they're not going to change much. But even in those cases it'll usually be easier for you in the long run to use the Menu Navigation system, even if heavily-modified, because at some point you're almost certainly going to want to add, reorder, or remove menu links... better to make that process as easy as clicking a couple buttons in Pro Edition's Menu Navigation feature.</nowiki></div>Sohohttps://wiki.soholaunch.com/index.php?title=Custom_Template_ReferenceCustom Template Reference2014-02-03T18:01:09Z<p>Soho: /* Other/Misc */</p>
<hr />
<div>[[Category:Templates]]<br />
<br />
==Download .zip how-to package with PDF tutorial==<br />
Want to learn how to create your own templates for Pro Edition? [https://addons.soholaunch.com/media/Creating_Custom_Template_for_SOHO.zip Download this great how-to article] (with example files!) written by Soholaunch customer Jaun-Vincent Haasbroek.<br />
<br />
==Introduction==<br />
This section covers the creation and integration of custom templates for use with the Soholaunch Pro Edition, and is intended for graphic designers and site developers. As such, a working knowledge of Adobe Photoshop and HTML programming is recommended.<br />
<br />
===How Pro Edition interprets template information===<br />
Within the maintenance platform, users will only have access to the page “content” area for editing. This means that each site must have a template design that maintains continuity throughout the site. Automatic menu generation is built in to the Soholaunch management tool so that Menu Display buttons and sub-page buttons can be defined within the template (using special Pound Variables). This gives you the option of placing Menu Display systems vertically, on the left or right of the page layout, or horizontally, across the top or bottom of your pages.<br />
<br />
You may also wish to custom-design your main navigation system and not use the Menu Display feature at all. This allows you to have total control over font, colors and sizes of your navigation structure. For even greater flexibility in design, different templates may be assigned to individual site pages throughout your site.<br />
<br />
Your template designs can take on any level of complexity that you wish them to have. However, please note that the user, via the management tool, cannot change any images, text, or links built into the template. This should always be planned and noted well ahead of the build process.<br />
<br />
==Template folder and files==<br />
Place all files(images,index.html,custom.css, etc) into a folder and name the folder like this...<br />
<pre><br />
Category-Sub_Category-Color<br />
<br />
Example: Category-Template_Name-Color<br />
</pre><br />
<br />
Possible files in your template folder (aside from images):<br />
<br />
'''index.html''' (REQUIRED) - The main HTML template file for your website used accross all site pages. This file must exist in your template folder in order for site pages to display at all.<br />
<br />
'''cart.html''' (OPTIONAL) - Custom shopping cart template. If found in your template folder, it will be used in place of index.html on shopping cart system pages (as in: when website visitor is browsing/purchasing products via your online checkout process).<br />
<br />
'''home.html''' (OPTIONAL) - If found in your template folder, it will be used in place of index.html on the "Home Page" (whatever page you've assigned to be your start/index/home/default page).<br />
<br />
'''news.html''' (OPTIONAL) - Custom blog/article display template. If found in your template folder, it will be used in place of index.html when visitor views full text of blog entry or news item.<br />
<br />
'''custom.css''' (OPTIONAL) - If found in your template folder, it will be used in place of the default stylesheet (runtime.css).<br />
<br />
'''cart.css''' (OPTIONAL) - If found in your template folder, it will be used in place of the default stylesheet (runtime.css) on shopping cart system pages. This is mainly usefull in conjunction with cart.html. That way you can have a separate template html file as well as a separate style sheet for shopping cart system pages.<br />
<br />
'''[[Modifying_cart_system_styles|shopping_cart.css]]''' (OPTIONAL) - If found in your template folder, will be included instead of pulling the colors/styles set in Shopping Cart > Display Settings. Note that this performs a completely different function than cart.css.<br />
<br />
'''template_variable_rules.php''' (OPTIONAL) - If found in your template folder, it will be included within pgm-realtime_builder.php right before all of the other #variables# are processed, allowing your template to use custom pound variables <br />
and even override standard pound variable functionality if you want to.<br />
<br />
===Source file overrides===<br />
'''pgm-auto_menu.php''' (OPTIONAL) - This is the file that puts together the html output for the various menu navigation systems (vmenu, hmains, etc) when your website is viewed. If found in your template folder, it will be used instead of the standard pgm-auto_menu.php file. The idea here it to download the original pgm-auto_menu.php from your docroot or from sohoadmin/client_files/base_files (same file, 2 locations), make a copy of it and stick it in your template folder, then modify it to all kinds of crazy things with your menu system.<br />
<br />
'''pgm-faq_display.php''' (OPTIONAL) - When a visitor views a page with FAQs on it, this file is called to build the HTML output for the FAQs. If you make a copy of this file and stick it in your template folder, your (presumably modified) copy will be used instead of the standard file. Do this when you want to trick out how your FAQs display, [http://info.soholaunch.com/Support.php like Soholaunch did on our main website] --- links to the support page, scroll down to see FAQs...we added those big 'Q' graphics and customized the font.<br />
<br />
'''pgm-promo_boxes.php''' (OPTIONAL) - When a visitor views a page whose template uses #NEWSBOX#, #BOX1#, etc, this file is called to build the HTML output for the news/promo boxes. If you make a copy of this file and stick it in your template folder, your (presumably modified) copy will be used instead of the standard file. Do this when you want to trick out how your news/promo boxes display further than you can via the Template Box Manager. Literally unlimited modification potential here.<br />
<br />
'''pgm-blog_display.php''' (OPTION) - Called when visitor views a page with a blog dropped on it. This is the file that spits out the archive links, etc. If found in your template folder, it will be used instead of the standard pgm-auto_menu.php file. Added in v4.9 r32.<br />
<br />
==Pound Variables==<br />
'''Pound Variables:''' unique variables that tell Pro Edition where to place specific “client changeable” headers, Menu Display buttons, and automatic text menus within your layout. These are not case sensitive, and can be placed visually within your HTML editor as text, so long as they contain the pound sign. <br />
<br />
'''Note: Should be in all-caps!'''<br />
<br />
<nowiki>#CONTENT#</nowiki> - Tells the system where to display the table that will hold all the content created within the Pro Edition’s Page Editor.<br />
Note: User will not be able to manage page content unless this variables is placed somewhere in your html template file (i.e. index.html).<br />
<br />
<nowiki>#LOGO#</nowiki> - Replaced with data from "Template Manager > Template header line". Inserts an editable Header line that can be changed by the user via the Soholaunch Pro Edition's Template Manager feature.<br />
<br />
<span id="logo-alt"></span> <nowiki>#LOGO#-ALT</nowiki> Same as #LOGO# except #LOGO#-ALT only displays if a logo image is not specified for #LOGOIMG# . This allows template designers to create templates that can accommodate an image or text logo, but not both.<br />
<br />
<nowiki>#LOGOIMG#</nowiki> - Custom Logo variable added which inserts a logo which is chosen in the Template Manager Module.<br />
<br />
<nowiki>#SLOGAN#</nowiki> - Custom Logo variable added which inserts a company slogan or moto which is chosen in the Template Manager Module.<br />
<br />
===Menu systems===<br />
<br />
<nowiki>#HMAINS#</nowiki> - Main page links only, arranged horizontally (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#VMAINS#</nowiki> - Main page links only, arranged vertically (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#HSUBS#</nowiki> - Sub page links only, arranged horizontally (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#VSUBS#</nowiki> - Sub page links only, arranged vertically (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#TMENU#</nowiki> - Inserts a horizontal, text based menu system that matches the “setup” of the Main and Sub menu system as configured via the Menu Display feature. Typically used for footer links.<br />
<br />
*Ultra only <nowiki>#FLYOUTMENU#</nowiki> Inserts a horizontal menu with a flyout menu for subpages.<br />
<br />
*Ultra only <nowiki>#VFLYOUTMENU#</nowiki> Inserts a vertical menu with a flyout menu for subpages.<br />
<br />
<nowiki>#PAGENAME#</nowiki> - Replaces with name of current page (underscores converted into spaces).<br />
<br />
<nowiki>#PAGETITLE#</nowiki> - Unique page name. Replaced with text defined via Edit Pages > Page Properties > Page Title<br />
<br />
<nowiki>#USERSONLINE#</nowiki> - Replaced with the number of visitors currently browsing your website. This particular variable may be also be used within the Text Editor.<br />
<br />
<nowiki>#AUTODATESTAMP#</nowiki> - Replaced the current weekday, month, day, and year.<br />
<br />
<nowiki>#PROMOTXT1#/#PROMOTXT2#</nowiki> - Text variables added which inserts the first 255 characters of blog_data pulled from random blog_content entry (under special "Promo Box 1/2" blog categories)<br />
<br />
<nowiki>#PROMOHDR1#/#PROMOHDR2#</nowiki> - Promo entry title. Works with --- the blog_title associated with blog_content entry pulled for <nowiki>#PROMOTXT1#/#PROMOTXT2#</nowiki><br />
<br />
<nowiki>#NEWSBOX#</nowiki> - Newsbox variable added which inserts text arranged by date, blog_title, and if desired a few lines of blog_data.<br />
<br />
===Company Information===<br />
[[User:Ruben|Ruben]] 11:40, 22 May 2006 (CDT)<br />
Below are a list of BIZ tags which information is pulled from the Global settings area.<br />
<br />
contact information tags that can be used:<br />
<br />
<nowiki>#BIZ-DOMAIN#</nowiki> - Replaces with Domain name.<br />
<br />
<nowiki>#BIZ-COMPANY#</nowiki> - Replaces with Company name.<br />
<br />
<nowiki>#BIZ-ADDRESS1#</nowiki> - Replaces with 1st address line.<br />
<br />
<nowiki>#BIZ-ADDRESS2#</nowiki> - Replaces with 2nd address line.<br />
<br />
<nowiki>#BIZ-ZIP# </nowiki> - Replaces with zip code.<br />
<br />
<nowiki>#BIZ-CITY#</nowiki> - Replaces with City name.<br />
<br />
<nowiki>#BIZ-STATE#</nowiki> - Replaces with State name.<br />
<br />
<nowiki>#BIZ-COUNTRY#</nowiki> - Replaces with Country name.<br />
<br />
<nowiki>#BIZ-EMAIL#</nowiki> - Replaces with email address.<br />
<br />
<nowiki>#BIZ-PHONE#</nowiki> - Replaces with phone number.<br />
<br />
<nowiki>#BIZ-FAX#</nowiki> - Replaces with fax number.<br />
<br />
<nowiki>#COPYRIGHT#</nowiki> -Replaced with copyright text from global settings, prefixed with the copyright symbol &copy;<br />
<br />
===Custom script includes===<br />
====<nowiki>#CUSTOMINC#</nowiki>====<br />
Replaced with output of "includethis.inc" (if found), which should be placed in the template's folder along with index.html, custom.css, etc.<br />
<br />
====<nowiki>#CUSTOMINC2#</nowiki>====<br />
Replaced with output of "includethis2.inc" (if found), which should be placed in the template's folder along with index.html, custom.css, etc<br />
<br />
====<nowiki><!---#INC-myfile.php#--></nowiki>====<br />
Initiates php call to include("myfile.php"). Note that the pound variable itself is not actually replaced in the template html when this happens, which is it should be contained within an HTML comment tag. Include file (i.e. myfile.php) should be in your template folder.<br />
<br />
====<nowiki>#OUTPUT-myfile.php#</nowiki>====<br />
Replaced with the ''output'' of file you specify (i.e. myfile.php). Include file (i.e. myfile.php) should be in your template folder.This is what you should use if you want your custom include file to dynamically build some html and spit it out at certain place in the template html (or similiar situation). This is also handy for pulling in javascript functions that have php-created pieces to them.<br />
<br />
===Other/Misc===<br />
====<nowiki>#BOX1# - #BOX8#</nowiki>====<br />
Adding #BOX1# to a template is similar to #NEWSBOX# but gives the user much more control within the Template Manager in the Box Manager.<br />
<br />
Once a template with this variable is selected in the template manager, the option to modify #BOX# display settings will become available within the Template Features area.<br />
<br />
====<nowiki>#BOX-TITLE1# - #BOX-TITLE8#</nowiki>====<br />
Adding #BOX-TITLE1# to a template allows the user to change a box title within the Box Manager.<br />
<br />
====<nowiki>#JQUERY# (ULTRA ONLY)</nowiki>====<br />
Placing #JQUERY# into the template's index.html/.php file adds the latest stable version of the jQuery library. This enables your template to use jQuery if you are using the library as part of your development. It works whether you referencing an external javascript file or using jQuery directly on the index page.<br />
<br />
====<nowiki>#template_folder#</nowiki>====<br />
Replaced with folder name of template assigned to page currently being viewied. Added so plugin/template developers can know the current template folder for image paths, etc.<br />
<br />
''Example value of #template_folder#:'' <br />
<br />
ANIMALS-Kittens_Awww-Cute_Blue.<br />
<br />
*Ultra only ====<nowiki>#relative_template_path#</nowiki>==== Replaced with relative path from document root foler.<br />
''Example value of #relative_template_path#:'' <br />
sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
====<nowiki>#template_path#</nowiki>====<br />
Replaced with full server path from root, up to and including folder name of template assigned to page currently being viewied. <br />
<br />
''Example value of #template_path#:'' <br />
/home/sites/example.com/sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
Added so plugin developers can know the current template folder for script include paths and such.<br />
<br />
====<nowiki>#template_path_full_url#</nowiki>==== - Replaced with absolute url path to template folder, accounts for http/https, helps with image src's and such.<br />
<br />
''Example value of #template_path_full_url#:'' <br />
<br />
http://example.com/sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
====<nowiki>#plugin-[whatever]#</nowiki>==== <br />
- Put #plugin-[whatever]# pound variable(s) in your custom templates to designate areas designed to work with a specific plugin (that when installed will replace that var with it's own content). <br />
<br />
All remaining (unreplaced by a plugin) #plugin-[whatever]# tags will be stripped from template html before final page content displays. That way if the plugin that works with a given #plugin-[whatever]# var is not installed, you won't see a bunch of raw #plugin-[whatever]#'s all over the template when the site is viewed.<br />
<br />
'''Example usage''' <br />
Let's say somebody develops a plugin called "Say Hello World 1.0" that as one of it's features searches for #pound-helloworld# within the template html and replaces it with the text "Hello World".<br />
<br />
Template developers who wish to make their templates more appealing by accommadating people who use the "Say Hello World 1.0" plugin can stick #pound-helloworld# in their template in some special place and not have to worry about the raw "#pound-helloworld#" pound var text displaying on sites where the "Say Hello World 1.0" plugin is NOT installed because if the plugin's not installed that pound var text will be simply stripped from the output html before the site page is loaded.<br />
<br />
==User Images==<br />
[[Image:Tman-template images.gif|thumb|When user selects a template in Template Manager that uses image files with the _userimg- prefix he is given access to the Template Images feature]]<br />
[[Image:Template_images.gif|thumb|Template Images feature allows user to swap out certain template images (any template image with a _userimg- prefix) with his own images]]<br />
One of the top modification requests from purchases of custom templates is "Can you change that one image to something else?". This is what the Template Images feature was designed to address. <br />
<br />
You can give the user control over any image in your template by prefixing the image's file name with "_userimg-", like so...<br />
<img src="_userimg-template_header.jpg"><br />
<br />
===All you have to do is name the file right===<br />
As the template developer, all you have to worry about is naming your image files with that _userimg- prefix. The Soholaunch tool will take care of the rest.<br />
<br />
The system only needs the right image filename to detect that a particular image should be user-controllable. It doesn't matter where or how you use the image in your template html. It could be a background image assigned via a css in rule, it could be a normal image tag...whatever.<br />
<br />
'''Note: Image must be called in your template html file. Will not work with image calls in separate custom.css file. So if you have css rules that you want to use the _userimg- thing with, put them directly in your template html using <style> tags.'''<br />
<br />
===Code Examples - Any image can be a user image===<br />
The following are just a few examples of how you could utilize the _userimg- functionality.<br />
<br />
You could let them change the header background image defined in your css rules...<br />
<pre><br />
#header {<br />
background-image: url('_userimg-header_bg.gif');<br />
}<br />
</pre><br />
<br />
Or maybe the menu background pattern defined via inline css...<br />
<pre><br />
<div id="vmenu" style="background-image: url('_userimg-vmenu_bg.gif');repeat: repeat-y;"><br />
#vmenu#<br />
</div><br />
</pre><br />
<br />
Or maybe you have an image of a semi truck in your home page splash template (home.html) and you want the template to be easily used for other industry applications...<br />
<pre><br />
<img src="_userimg-semi_truck.jpg"/><br />
</pre><br />
<br />
The point is: You can make any image in your template controllable by the user as long as you give the image file that _userimg- prefix.<br />
<br />
==Uploading custom templates==<br />
If you're running v4.8.5 or later...<br />
Zip up your Template Folder and Files and upload the .zip file via Template Manager > Upload Custom Template (below Base Site Template selection). Once uploaded the product will automatically extract your .zip file in the correct location, and the template will be availible in the list of templates (drop-downs and browse by screenshot).<br />
<br />
If you're running a version prior to v4.8.5, or if you want to quickly update individual template files...<br />
Log-in to your site via FTP and upload your template folder (containing all template files) to this folder:<br />
<pre><br />
sohoadmin/program/modules/site_templates/pages<br />
</pre><br />
<br />
==Hard-coded page links==<br />
When using custom navigation elements, you will need to know how to code various links. Since the entire site created within the product platform is database-driven, it is necessary to call pages differently than when coding for traditional HTML pages. Theses links must be added inside the template file.<br />
<br />
Normal Page Links<br />
<br />
Let’s say that you have created a navigation button that should be linked to the “About Us” Page. The following code is what should be used to link your navigation element:<br />
<br />
index.php?pr=About_Us<br />
<br />
Note: '''The page name is case sensitive''' and page name must be accurately depicted for proper operation. Notice that all spaces between words in the page names are separated by an underscore. This must be manually coded in place of spaces for the link to work properly.<br />
<br />
The actual page name is directly related to the page name created within the “Create Pages” module of the Soholaunch Pro Edition.<br />
<br />
Because your site is database driven, you will always call the “index.php” file when linking to normal site pages, like so...<br />
<pre>http://example.com/index.php?pr=Home_Page</pre><br />
<br />
And thanks to recent upgrades to make Soholaunch-created website more SEO-friendly, you can also link to the .php file that is automatically created for each site page, like so...<br />
<pre>http://example.com/Home_Page.php</pre><br />
<br />
'''Note:''' Don't hard-code menu links if you're planning to sell your template on the Addons site. This option is only recommended if you're building a template for a specific site only and you know exactly what links will be on the menu and that they're not going to change much. But even in those cases it'll usually be easier for you in the long run to use the Menu Navigation system, even if heavily-modified, because at some point you're almost certainly going to want to add, reorder, or remove menu links... better to make that process as easy as clicking a couple buttons in Pro Edition's Menu Navigation feature.</nowiki></div>Sohohttps://wiki.soholaunch.com/index.php?title=Custom_Template_ReferenceCustom Template Reference2014-01-21T17:08:04Z<p>Soho: </p>
<hr />
<div>[[Category:Templates]]<br />
<br />
==Download .zip how-to package with PDF tutorial==<br />
Want to learn how to create your own templates for Pro Edition? [https://addons.soholaunch.com/media/Creating_Custom_Template_for_SOHO.zip Download this great how-to article] (with example files!) written by Soholaunch customer Jaun-Vincent Haasbroek.<br />
<br />
==Introduction==<br />
This section covers the creation and integration of custom templates for use with the Soholaunch Pro Edition, and is intended for graphic designers and site developers. As such, a working knowledge of Adobe Photoshop and HTML programming is recommended.<br />
<br />
===How Pro Edition interprets template information===<br />
Within the maintenance platform, users will only have access to the page “content” area for editing. This means that each site must have a template design that maintains continuity throughout the site. Automatic menu generation is built in to the Soholaunch management tool so that Menu Display buttons and sub-page buttons can be defined within the template (using special Pound Variables). This gives you the option of placing Menu Display systems vertically, on the left or right of the page layout, or horizontally, across the top or bottom of your pages.<br />
<br />
You may also wish to custom-design your main navigation system and not use the Menu Display feature at all. This allows you to have total control over font, colors and sizes of your navigation structure. For even greater flexibility in design, different templates may be assigned to individual site pages throughout your site.<br />
<br />
Your template designs can take on any level of complexity that you wish them to have. However, please note that the user, via the management tool, cannot change any images, text, or links built into the template. This should always be planned and noted well ahead of the build process.<br />
<br />
==Template folder and files==<br />
Place all files(images,index.html,custom.css, etc) into a folder and name the folder like this...<br />
<pre><br />
Category-Sub_Category-Color<br />
<br />
Example: Category-Template_Name-Color<br />
</pre><br />
<br />
Possible files in your template folder (aside from images):<br />
<br />
'''index.html''' (REQUIRED) - The main HTML template file for your website used accross all site pages. This file must exist in your template folder in order for site pages to display at all.<br />
<br />
'''cart.html''' (OPTIONAL) - Custom shopping cart template. If found in your template folder, it will be used in place of index.html on shopping cart system pages (as in: when website visitor is browsing/purchasing products via your online checkout process).<br />
<br />
'''home.html''' (OPTIONAL) - If found in your template folder, it will be used in place of index.html on the "Home Page" (whatever page you've assigned to be your start/index/home/default page).<br />
<br />
'''news.html''' (OPTIONAL) - Custom blog/article display template. If found in your template folder, it will be used in place of index.html when visitor views full text of blog entry or news item.<br />
<br />
'''custom.css''' (OPTIONAL) - If found in your template folder, it will be used in place of the default stylesheet (runtime.css).<br />
<br />
'''cart.css''' (OPTIONAL) - If found in your template folder, it will be used in place of the default stylesheet (runtime.css) on shopping cart system pages. This is mainly usefull in conjunction with cart.html. That way you can have a separate template html file as well as a separate style sheet for shopping cart system pages.<br />
<br />
'''[[Modifying_cart_system_styles|shopping_cart.css]]''' (OPTIONAL) - If found in your template folder, will be included instead of pulling the colors/styles set in Shopping Cart > Display Settings. Note that this performs a completely different function than cart.css.<br />
<br />
'''template_variable_rules.php''' (OPTIONAL) - If found in your template folder, it will be included within pgm-realtime_builder.php right before all of the other #variables# are processed, allowing your template to use custom pound variables <br />
and even override standard pound variable functionality if you want to.<br />
<br />
===Source file overrides===<br />
'''pgm-auto_menu.php''' (OPTIONAL) - This is the file that puts together the html output for the various menu navigation systems (vmenu, hmains, etc) when your website is viewed. If found in your template folder, it will be used instead of the standard pgm-auto_menu.php file. The idea here it to download the original pgm-auto_menu.php from your docroot or from sohoadmin/client_files/base_files (same file, 2 locations), make a copy of it and stick it in your template folder, then modify it to all kinds of crazy things with your menu system.<br />
<br />
'''pgm-faq_display.php''' (OPTIONAL) - When a visitor views a page with FAQs on it, this file is called to build the HTML output for the FAQs. If you make a copy of this file and stick it in your template folder, your (presumably modified) copy will be used instead of the standard file. Do this when you want to trick out how your FAQs display, [http://info.soholaunch.com/Support.php like Soholaunch did on our main website] --- links to the support page, scroll down to see FAQs...we added those big 'Q' graphics and customized the font.<br />
<br />
'''pgm-promo_boxes.php''' (OPTIONAL) - When a visitor views a page whose template uses #NEWSBOX#, #BOX1#, etc, this file is called to build the HTML output for the news/promo boxes. If you make a copy of this file and stick it in your template folder, your (presumably modified) copy will be used instead of the standard file. Do this when you want to trick out how your news/promo boxes display further than you can via the Template Box Manager. Literally unlimited modification potential here.<br />
<br />
'''pgm-blog_display.php''' (OPTION) - Called when visitor views a page with a blog dropped on it. This is the file that spits out the archive links, etc. If found in your template folder, it will be used instead of the standard pgm-auto_menu.php file. Added in v4.9 r32.<br />
<br />
==Pound Variables==<br />
'''Pound Variables:''' unique variables that tell Pro Edition where to place specific “client changeable” headers, Menu Display buttons, and automatic text menus within your layout. These are not case sensitive, and can be placed visually within your HTML editor as text, so long as they contain the pound sign. <br />
<br />
'''Note: Should be in all-caps!'''<br />
<br />
<nowiki>#CONTENT#</nowiki> - Tells the system where to display the table that will hold all the content created within the Pro Edition’s Page Editor.<br />
Note: User will not be able to manage page content unless this variables is placed somewhere in your html template file (i.e. index.html).<br />
<br />
<nowiki>#LOGO#</nowiki> - Replaced with data from "Template Manager > Template header line". Inserts an editable Header line that can be changed by the user via the Soholaunch Pro Edition's Template Manager feature.<br />
<br />
<span id="logo-alt"></span> <nowiki>#LOGO#-ALT</nowiki> Same as #LOGO# except #LOGO#-ALT only displays if a logo image is not specified for #LOGOIMG# . This allows template designers to create templates that can accommodate an image or text logo, but not both.<br />
<br />
<nowiki>#LOGOIMG#</nowiki> - Custom Logo variable added which inserts a logo which is chosen in the Template Manager Module.<br />
<br />
<nowiki>#SLOGAN#</nowiki> - Custom Logo variable added which inserts a company slogan or moto which is chosen in the Template Manager Module.<br />
<br />
===Menu systems===<br />
<br />
<nowiki>#HMAINS#</nowiki> - Main page links only, arranged horizontally (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#VMAINS#</nowiki> - Main page links only, arranged vertically (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#HSUBS#</nowiki> - Sub page links only, arranged horizontally (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#VSUBS#</nowiki> - Sub page links only, arranged vertically (links managed via the Menu Display module; must set "Auto-Menu Display Type" to "Text Links").<br />
<br />
<nowiki>#TMENU#</nowiki> - Inserts a horizontal, text based menu system that matches the “setup” of the Main and Sub menu system as configured via the Menu Display feature. Typically used for footer links.<br />
<br />
*Ultra only <nowiki>#FLYOUTMENU#</nowiki> Inserts a horizontal menu with a flyout menu for subpages.<br />
<br />
*Ultra only <nowiki>#VFLYOUTMENU#</nowiki> Inserts a vertical menu with a flyout menu for subpages.<br />
<br />
<nowiki>#PAGENAME#</nowiki> - Replaces with name of current page (underscores converted into spaces).<br />
<br />
<nowiki>#PAGETITLE#</nowiki> - Unique page name. Replaced with text defined via Edit Pages > Page Properties > Page Title<br />
<br />
<nowiki>#USERSONLINE#</nowiki> - Replaced with the number of visitors currently browsing your website. This particular variable may be also be used within the Text Editor.<br />
<br />
<nowiki>#AUTODATESTAMP#</nowiki> - Replaced the current weekday, month, day, and year.<br />
<br />
<nowiki>#PROMOTXT1#/#PROMOTXT2#</nowiki> - Text variables added which inserts the first 255 characters of blog_data pulled from random blog_content entry (under special "Promo Box 1/2" blog categories)<br />
<br />
<nowiki>#PROMOHDR1#/#PROMOHDR2#</nowiki> - Promo entry title. Works with --- the blog_title associated with blog_content entry pulled for <nowiki>#PROMOTXT1#/#PROMOTXT2#</nowiki><br />
<br />
<nowiki>#NEWSBOX#</nowiki> - Newsbox variable added which inserts text arranged by date, blog_title, and if desired a few lines of blog_data.<br />
<br />
===Company Information===<br />
[[User:Ruben|Ruben]] 11:40, 22 May 2006 (CDT)<br />
Below are a list of BIZ tags which information is pulled from the Global settings area.<br />
<br />
contact information tags that can be used:<br />
<br />
<nowiki>#BIZ-DOMAIN#</nowiki> - Replaces with Domain name.<br />
<br />
<nowiki>#BIZ-COMPANY#</nowiki> - Replaces with Company name.<br />
<br />
<nowiki>#BIZ-ADDRESS1#</nowiki> - Replaces with 1st address line.<br />
<br />
<nowiki>#BIZ-ADDRESS2#</nowiki> - Replaces with 2nd address line.<br />
<br />
<nowiki>#BIZ-ZIP# </nowiki> - Replaces with zip code.<br />
<br />
<nowiki>#BIZ-CITY#</nowiki> - Replaces with City name.<br />
<br />
<nowiki>#BIZ-STATE#</nowiki> - Replaces with State name.<br />
<br />
<nowiki>#BIZ-COUNTRY#</nowiki> - Replaces with Country name.<br />
<br />
<nowiki>#BIZ-EMAIL#</nowiki> - Replaces with email address.<br />
<br />
<nowiki>#BIZ-PHONE#</nowiki> - Replaces with phone number.<br />
<br />
<nowiki>#BIZ-FAX#</nowiki> - Replaces with fax number.<br />
<br />
<nowiki>#COPYRIGHT#</nowiki> -Replaced with copyright text from global settings, prefixed with the copyright symbol &copy;<br />
<br />
===Custom script includes===<br />
====<nowiki>#CUSTOMINC#</nowiki>====<br />
Replaced with output of "includethis.inc" (if found), which should be placed in the template's folder along with index.html, custom.css, etc.<br />
<br />
====<nowiki>#CUSTOMINC2#</nowiki>====<br />
Replaced with output of "includethis2.inc" (if found), which should be placed in the template's folder along with index.html, custom.css, etc<br />
<br />
====<nowiki><!---#INC-myfile.php#--></nowiki>====<br />
Initiates php call to include("myfile.php"). Note that the pound variable itself is not actually replaced in the template html when this happens, which is it should be contained within an HTML comment tag. Include file (i.e. myfile.php) should be in your template folder.<br />
<br />
====<nowiki>#OUTPUT-myfile.php#</nowiki>====<br />
Replaced with the ''output'' of file you specify (i.e. myfile.php). Include file (i.e. myfile.php) should be in your template folder.This is what you should use if you want your custom include file to dynamically build some html and spit it out at certain place in the template html (or similiar situation). This is also handy for pulling in javascript functions that have php-created pieces to them.<br />
<br />
===Other/Misc===<br />
====<nowiki>#BOX1# - #BOX8#</nowiki>====<br />
Adding #BOX1# to a template is similar to #NEWSBOX# but gives the user much more control within the Template Manager in the Box Manager.<br />
<br />
Once a template with this variable is selected in the template manager, the option to modify #BOX# display settings will become available within the Template Features area.<br />
<br />
====<nowiki>#BOX-TITLE1# - #BOX-TITLE8#</nowiki>====<br />
Adding #BOX-TITLE1# to a template allows the user to change a box title within the Box Manager.<br />
<br />
====<nowiki>#template_folder#</nowiki>====<br />
Replaced with folder name of template assigned to page currently being viewied. Added so plugin/template developers can know the current template folder for image paths, etc.<br />
<br />
''Example value of #template_folder#:'' <br />
<br />
ANIMALS-Kittens_Awww-Cute_Blue.<br />
<br />
*Ultra only ====<nowiki>#relative_template_path#</nowiki>==== Replaced with relative path from document root foler.<br />
''Example value of #relative_template_path#:'' <br />
sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
====<nowiki>#template_path#</nowiki>====<br />
Replaced with full server path from root, up to and including folder name of template assigned to page currently being viewied. <br />
<br />
''Example value of #template_path#:'' <br />
/home/sites/example.com/sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
Added so plugin developers can know the current template folder for script include paths and such.<br />
<br />
====<nowiki>#template_path_full_url#</nowiki>==== - Replaced with absolute url path to template folder, accounts for http/https, helps with image src's and such.<br />
<br />
''Example value of #template_path_full_url#:'' <br />
<br />
http://example.com/sohoadmin/program/modules/site_templates/pages/ANIMALS-Kittens_Awww-Cute_Blue<br />
<br />
====<nowiki>#plugin-[whatever]#</nowiki>==== <br />
- Put #plugin-[whatever]# pound variable(s) in your custom templates to designate areas designed to work with a specific plugin (that when installed will replace that var with it's own content). <br />
<br />
All remaining (unreplaced by a plugin) #plugin-[whatever]# tags will be stripped from template html before final page content displays. That way if the plugin that works with a given #plugin-[whatever]# var is not installed, you won't see a bunch of raw #plugin-[whatever]#'s all over the template when the site is viewed.<br />
<br />
'''Example usage''' <br />
Let's say somebody develops a plugin called "Say Hello World 1.0" that as one of it's features searches for #pound-helloworld# within the template html and replaces it with the text "Hello World".<br />
<br />
Template developers who wish to make their templates more appealing by accommadating people who use the "Say Hello World 1.0" plugin can stick #pound-helloworld# in their template in some special place and not have to worry about the raw "#pound-helloworld#" pound var text displaying on sites where the "Say Hello World 1.0" plugin is NOT installed because if the plugin's not installed that pound var text will be simply stripped from the output html before the site page is loaded.<br />
<br />
==User Images==<br />
[[Image:Tman-template images.gif|thumb|When user selects a template in Template Manager that uses image files with the _userimg- prefix he is given access to the Template Images feature]]<br />
[[Image:Template_images.gif|thumb|Template Images feature allows user to swap out certain template images (any template image with a _userimg- prefix) with his own images]]<br />
One of the top modification requests from purchases of custom templates is "Can you change that one image to something else?". This is what the Template Images feature was designed to address. <br />
<br />
You can give the user control over any image in your template by prefixing the image's file name with "_userimg-", like so...<br />
<img src="_userimg-template_header.jpg"><br />
<br />
===All you have to do is name the file right===<br />
As the template developer, all you have to worry about is naming your image files with that _userimg- prefix. The Soholaunch tool will take care of the rest.<br />
<br />
The system only needs the right image filename to detect that a particular image should be user-controllable. It doesn't matter where or how you use the image in your template html. It could be a background image assigned via a css in rule, it could be a normal image tag...whatever.<br />
<br />
'''Note: Image must be called in your template html file. Will not work with image calls in separate custom.css file. So if you have css rules that you want to use the _userimg- thing with, put them directly in your template html using <style> tags.'''<br />
<br />
===Code Examples - Any image can be a user image===<br />
The following are just a few examples of how you could utilize the _userimg- functionality.<br />
<br />
You could let them change the header background image defined in your css rules...<br />
<pre><br />
#header {<br />
background-image: url('_userimg-header_bg.gif');<br />
}<br />
</pre><br />
<br />
Or maybe the menu background pattern defined via inline css...<br />
<pre><br />
<div id="vmenu" style="background-image: url('_userimg-vmenu_bg.gif');repeat: repeat-y;"><br />
#vmenu#<br />
</div><br />
</pre><br />
<br />
Or maybe you have an image of a semi truck in your home page splash template (home.html) and you want the template to be easily used for other industry applications...<br />
<pre><br />
<img src="_userimg-semi_truck.jpg"/><br />
</pre><br />
<br />
The point is: You can make any image in your template controllable by the user as long as you give the image file that _userimg- prefix.<br />
<br />
==Uploading custom templates==<br />
If you're running v4.8.5 or later...<br />
Zip up your Template Folder and Files and upload the .zip file via Template Manager > Upload Custom Template (below Base Site Template selection). Once uploaded the product will automatically extract your .zip file in the correct location, and the template will be availible in the list of templates (drop-downs and browse by screenshot).<br />
<br />
If you're running a version prior to v4.8.5, or if you want to quickly update individual template files...<br />
Log-in to your site via FTP and upload your template folder (containing all template files) to this folder:<br />
<pre><br />
sohoadmin/program/modules/site_templates/pages<br />
</pre><br />
<br />
==Hard-coded page links==<br />
When using custom navigation elements, you will need to know how to code various links. Since the entire site created within the product platform is database-driven, it is necessary to call pages differently than when coding for traditional HTML pages. Theses links must be added inside the template file.<br />
<br />
Normal Page Links<br />
<br />
Let’s say that you have created a navigation button that should be linked to the “About Us” Page. The following code is what should be used to link your navigation element:<br />
<br />
index.php?pr=About_Us<br />
<br />
Note: '''The page name is case sensitive''' and page name must be accurately depicted for proper operation. Notice that all spaces between words in the page names are separated by an underscore. This must be manually coded in place of spaces for the link to work properly.<br />
<br />
The actual page name is directly related to the page name created within the “Create Pages” module of the Soholaunch Pro Edition.<br />
<br />
Because your site is database driven, you will always call the “index.php” file when linking to normal site pages, like so...<br />
<pre>http://example.com/index.php?pr=Home_Page</pre><br />
<br />
And thanks to recent upgrades to make Soholaunch-created website more SEO-friendly, you can also link to the .php file that is automatically created for each site page, like so...<br />
<pre>http://example.com/Home_Page.php</pre><br />
<br />
'''Note:''' Don't hard-code menu links if you're planning to sell your template on the Addons site. This option is only recommended if you're building a template for a specific site only and you know exactly what links will be on the menu and that they're not going to change much. But even in those cases it'll usually be easier for you in the long run to use the Menu Navigation system, even if heavily-modified, because at some point you're almost certainly going to want to add, reorder, or remove menu links... better to make that process as easy as clicking a couple buttons in Pro Edition's Menu Navigation feature.</nowiki></div>Sohohttps://wiki.soholaunch.com/index.php?title=How_toHow to2013-12-27T16:43:21Z<p>Soho: /* Create a Foundation/Boostrap compatible template */</p>
<hr />
<div>==Create a Foundation/Boostrap compatible template==<br />
<br />
Foundation and Bootstrap are the two reigning HTML frameworks for creating responsive HTML and CSS. Ultra is fully-compatible with both Foundation and Bootstrap, where as Pro is mostly compatible. There are two main steps to creating Bootstrap and Foundation-compatible Soholaunch templates.<br />
<br />
1. Create the template design via Bootstrap or Foundation (of those two, I recommend Foundation).<br />
<br />
2. Add the soho #variables# like you normally do.<br />
<br />
3. In Ultra, you're be done now. <br />
<br />
The rest of these instructions only apply if you're using Soholaunch Pro.<br />
<br />
4. NAV MENU: Make a copy of the pgm-auto_menu.php file and add the Foundation or Bootstrap classes to the html that gets outputted for your navigation menu.<br />
<br />
5. CONTENT AREA: Pro uses an HTML table to produce the Page Editor's grid structure. This hard-width table will prevent responsive frameworks like Bootstrap/Foundation from collapsing content on mobile devices. To overcome this, you'll need to target this table with CSS change it's display structure (table, tr, and td tags) to be a normal block elements. This may affect your display and be frustrating to wrangle in. For this reason, we highly recommend using Soholaunch Ultra for Bootstrap/Foundation websites.<br />
<br />
==Use an Authorize.net reseller for your payment gateway==<br />
Many payment gateways are resellers of the popular Authorize.net payment gateway. They may offer better rates and packages, but ultimately they're selling the same technology, except that they use a different URL address for accepting payments. Both Soholaunch Pro and Soholaunch Ultra include a simple, built-in way to change the gateway URL on soho's built-in Authorize.net integration so that you can use Authorize.net reseller gateways.<br />
<br />
===How to change the Authorize===<br />
The Authorize.net gateway URL is composed of two parts...<br />
# The hostname: secure.authorize.net<br />
# The path: /gateway/transact.dll<br />
<br />
These are the two variables that you need to adjust to use your reseller gateway. You can add custom URL and path to the Soholaunch smt_userdata table using special variable names, and Soholaunch will use your custom host and path instead.<br />
<br />
# Go to the Database Tables feature<br />
# Click the System Tables tab.<br />
# Find the smt_userdata table<br />
# Click View/Edit Records<br />
# Add New Record<br />
# prikey (leave blank), plugin = 'cart_authorize', fieldname = 'scHost', data = '[your custom url]' (all those values should be typed WITHOUT the single quotes)<br />
# Save New Record<br />
# Add New Record<br />
# prikey (leave blank), plugin = 'cart_authorize', fieldname = 'scPath', data = '[your custom path]'<br />
# Save New Record<br />
# All done!<br />
<br />
==Add an XML Sitemap to your website==<br />
'''Part one: Generate a sitemap'''<br />
# Visit [http://xml-sitemaps.com xml-sitemaps.com]<br />
# Follow-the instructions to generate an XML sitemap for your site.<br />
# Copy the sitemap it generates (Ctrl+c)<br />
# Open MS Notepad (or Typepad on a Mac)<br />
# Paste in your sitemap (Ctrl+v)<br />
# Save the file as sitemap.xml<br />
<br />
'''Part two: Upload sitemap'''<br />
# Log-in to your sohoadmin<br />
# From the Main Menu, press the F4 key to launch the secret super-tool.<br />
# This screen may look scary, but it will help you upload the sitemap to your home folder.<br />
# Make sure the path at the top shows that you are in the public_html folder<br />
# Click the upload button to select the sitemap.xml file from your computer and upload it<br />
# All done!<br />
<br />
==Verify your site with Google Webmaster Tools==<br />
'''Part one: Add site to your Google account'''<br />
# Log-in to your Google Account<br />
# Go to Google Webmaster Tools<br />
# Click Add a Site<br />
# Click Manage site > Verify this site<br />
# Click the link to Download the HTML verification file<br />
# Save that file to your computer somewhere<br />
<br />
'''Part two: Upload verification file'''<br />
# Log-in to your sohoadmin<br />
# From the Main Menu, press the F4 key to launch the secret super-tool.<br />
# This screen may look scary, but it will help you upload Google's file to your home folder.<br />
# Make sure the path at the top shows that you are in the public_html folder<br />
# Click the upload button to select the Google file from your computer and upload it<br />
<br />
'''Part three: Finalize verification'''<br />
# Go back to Google Webmaster Tools<br />
# Click Verify<br />
# Done!<br />
<br />
==Put a text link on top of an image==<br />
There are a couple ways to put a link on top of an image. Here are two methods.<br />
<br />
===1. Overlay a normal text link on an image.===<br />
The idea here is to set your image as a background image for an element that contains your text link. <br />
<br />
So let's say you have an image called...<br />
kitten.jpg (300px width X 150px height)<br />
<br />
...and you want to lay a text link on it. What you're going to do is create a container element in html that has the same width and height as your image, assign your image to be the background image, and then put your text inside the container element. <br />
<br />
Flip over to the Text Editor's HTML view (you should also do this as a custom code file) and put in some html like below. You can copy-paste this if you'd like.<br />
<pre><br />
<div style="width: 300px;height: 150px;background-image: url('images/kitten.jpg');"><br />
<a href="http://example.com/Kittens.php">Click here to see kittens</a><br />
</div><br />
</pre><br />
<br />
===2. Create an image map===<br />
An image map is a combination of image and code that basically makes certain sections of the image clickable like links. You typically define the sections through a graphical image map maker. There are lots of free standalone products, and image mapping is a built in tool for most major web development software packages (e.g., Adobe Dreamweaver). <br />
<br />
Note that once you use such a program to create an image map, it will give you a bunch of code to insert on your page. Use Soholaunch's "Custom Code" drag-and-drop object to put that on your page.<br />
<br />
===3. Use absolute positioning with CSS===<br />
This is the "advanced" method. If you don't already know what this is, it will take more than a paragraph to explain it well. Going in-depth into CSS positioning would be a little out-of-scope for this page, and lots of people on the web have already done a great job explaining it. But if you're interested and you're the tinkering type, search around for [http://lmgtfy.com/?q=css+positioning+tutorial tutorials on CSS positioning]. You may want to do a few CSS primers first if you've never looked at it before.<br />
<br />
==Install Google Analytics code on your website==<br />
Google Analytics is an ultra-powerful stats package provided by Google for analyzing your website traffic. It will give you a dazzling amount of information about your site visitors.<br />
<br />
To use Google Analytics with your website, you must add Google's special tracking code to all of your site pages. Because Soholaunch uses templates (one master file that controls the style for your whole website), you don't have to worry about adding it to all your pages. You can just add it in one place and be done with it.<br />
<br />
There are two easy ways to add Google's code to your Soholaunch-powered website:<br />
<br />
===1. The Easy Way: Grab a plugin===<br />
Go try one of the [http://addons.soholaunch.com/?pr=Plugins&search_qry=analytics several Google Analytics plugins] available at [http://addons.soholaunch.com Soholaunch Addons]: <br />
<br />
===2. The Hard Way: Edit your template file===<br />
# [http://wiki.soholaunch.com/index.php?title=How_to#Find_your_template_folder First, find your template folder] through [http://wiki.soholaunch.com/index.php?title=How_to#Get_started_with_FTP FTP]<br />
# Locate the index.html file within your template folder<br />
# Follow Google's instructions for adding the code.<br />
# Also note that if your template folder contains a home.html file, you will need to add the Google Code there as well.<br />
<br />
==Export shopping cart products==<br />
Using the Database Tables feature it is possible to export your shopping cart products into a semicolon-delimited .csv file that you can then import into spreadsheets (e.g., Microsoft Excel) and many other systems. <br />
<br />
Here are instructions for exporting your shopping cart products:<br />
# Log-in to sohoadmin<br />
# From the Main Menu, click the Database Tables icon.<br />
# Click the System Tables tab<br />
# Find the "cart_products" table.<br />
# Click the "Download" link.<br />
# Save the file to your local computer<br />
<br />
==Prevent PayPal Order Number Conflicts==<br />
If you are using one paypal account to accept orders on more than one Soholaunch website, you may run into order number conflicts. This usually manifests in an error from PayPal that says something like "Order already exists". <br />
<br />
===The problem===<br />
The Soholaunch Shopping Cart starts it's order numbers off at 10000 and counts up one at a time per order, so your third order will be order #10003. When you use PayPal as your payment gateway, this order number is passed to paypal as the unique identifier number for PayPal.<br />
<br />
Normally, when you just have one website, this is all fine and dandy. But when you have two websites running through the same PayPal account, you start to get conflicts. If you've received three orders from Site A and three orders from Site B, the third order on both sites is going to pass to PayPal as #10003. When the Site B tries to run its third order through, PayPal says "Hey, no...that order number already exists" (because Site A used it earlier).<br />
<br />
===How to fix it===<br />
The fix for the duplicate order number problem is simple enough. You just need to jump the order numbers on one of your site to another range, so that the two order number ranges don't ever overlap.<br />
<br />
You can leave Site A alone in it's 10000 range. For Site B, do this...<br />
# Main Menu<br />
# Database Tables<br />
# System Tables tab<br />
# cart_invoices<br />
# View/Edit Records<br />
# Add New Record<br />
# Specify a really high number like 200000 for the ORDER_NUMBER<br />
# Leave all the other fields blank<br />
# Save<br />
# View table and delete your test record (if you want)<br />
# From now on order numbers will start at whatever number you put in (e.g., 200000)<br />
<br />
==Use special characters in your navigation menu links==<br />
<br />
Soholaunch does not currently support using special characters (anything besides letters, numbers, and spaces) in your site's menu navigation, neither in main page links nor in sub page links.<br />
<br />
Although we are working to improve this in future versions so that you can use whatever characters you want, there are ways to get around the current restriction in the mean time.<br />
<br />
===Method #1: Search and Replace Table===<br />
Let's assume you want to create a page called Lilo & Stitch. Normally, that ampersand will make the Soholaunch paging system <br />
<br />
# Name your page something that works under the standard page naming restrictions, so let's say "Lilo and Stitch".<br />
# Go Main Menu > Database Tables > User Tables > UDT_CONTENT_SEARCH_REPLACE > View/Edit Records<br />
# Add a Record<br />
# Search for: "Lilo and Stitch" (without the quotes)<br />
# Replace with: "Lilo & Stitch" (without the quotes)<br />
<br />
===Method #2: Hard code your menu===<br />
If you are comfortable modifying the html file for your template, you can certainly hard-code your menu navigation directly into the HTML file and use whatever special characters you want.<br />
<br />
==Copy-Paste Content from Microsoft Word==<br />
Pasting from MS Word is always a problem for WYSIWYG editors like the Soholaunch Text Editor, because the content that you copy from Word carries all of this crappy Microsoft psuedo-html code with it. Some of that code works; some of it can't be interpreted by the browser. Hence the funky, half-working result you end up with a lot of times.<br />
<br />
To combat this, we recommend two options:<br />
<br />
1. Instead of normal pasting (Ctrl+V or right-click, paste), use the Paste from Word button inside the Soholaunch Text Editor. Note that this button does not work in FireFox (not for lack of trying). When you hit that button, the soho editor will try to translate the odd MS Word code into to real html code, which will usually yield a bit better results than just normal pasting.<br />
<br />
2. Strip all the formatting before you paste. As in, copy the content from MS Word, paste it in a bare-bones text editor like MS Notepad, then copy from there in to the soho editor and format as you like. This is certainly the most reliable, quirk-free method, though it does require you to re-do your formatting.<br />
<br />
==How to find your FTP login==<br />
If you submit support tickets with us, we will usually ask you for your "FTP" login username and password. If your web hosting company offers "cPanel", then this username/password is probably the same as your "cPanel" user name and password. You usually find this log-in information in the "Welcome" email that your web hosting company sent you when you first signed up with them.<br />
<br />
==How to fix a corrupt page==<br />
Sometimes certain content on a page will break the page editor. Often you don't know this is happening until it's too late and your page is corrupted. <br />
<br />
Symptoms of a corrupt page:<br />
* Page Editor: Fails to load<br />
* Page Editor: Cannot delete objects<br />
* Page Editor: Not all grid squares display<br />
* Page does not display correctly (or at all)<br />
<br />
Cause of corrupt page: Code or script that you have copy-pasted from elsewhere is messing with the page editor.<br />
<br />
If this happens to you the best thing to do is create a new page, then re-place your content from the broken page one element at a time. Of special note: To be extra safe, put all suspicious content on the page using the Custom Code object (which prevents the Page Editor from trying to interpret it).<br />
<br />
Note: Again, the cause of corrupt pages is almost always broken html code that you have copy-pasted, or javascript that you have copy-pasted into the Text Editor. If you need to put javascript or other special code on the page, do it with the Custom Code object.<br />
<br />
Note2: You may have to completely delete the original page and start over.<br />
<br />
Related: [http://wiki.soholaunch.com/index.php?title=How_to#Put_some_HTML_on_a_page_as_a_custom_code How to place something on a page as custom code]<br />
<br />
==How to add anchor links==<br />
Here is how you install anchors to text in Soholaunch:<br />
<br />
# In the text editor, place your cursor at the place where you would like the anchor. Click the anchor button and create a short, single word name for the anchor. Click Insert.<br />
# Now go to the text you would like linked to that anchor and select (highlight) the text.<br />
# Click the insert/edit link button. in the Anchors dropdown select the correct anchor for the text and click insert.<br />
<br />
That should help you. Keep in mind that you create the anchor first and then link text to the anchor. Also, anchors are only valid within the same text editor. If you have multiple text boxes on a page the anchors will not work between separate text boxes.<br />
<br />
==Update to the latest version==<br />
From the Main Menu of /sohoadmin...<br />
# Click the Webmaster buttton on the top nav<br />
# Click the Software Updates button<br />
# Click the big "Check for Updates Now" button<br />
# Select the build you want to install<br />
# Click "Install"<br />
<br />
==Download new language translation files==<br />
Translations of the Soholaunch product are now handled at http://translate.soholuaunch.com. If you speak multiple languages and want to help translate Soholaunch, you can go to that site, sign up for a free account, and start translating immediately.<br />
<br />
At any time you can download the latest language file for a given language. Here's how...<br />
# Go to http://translate.soholaunch.com<br />
# Sign-up/Log-in<br />
# Set language to the language you want to download (e.g., Hebrew)<br />
# Click link at top-left to download latest translation files<br />
<br />
Once you have downloaded the latest language file you can add it to your Soholaunch-powered website by logging-in via FTP, and uploading the hebrew.php (or spanish.php, or whatever.php) file you downloaded to this folder...<br />
public_html/sohoadmin/language<br />
<br />
==Make text scroll like a marquee==<br />
The old Text Editor (< v4.9.3) used to include a "marquee" feature that would allow you to make any block of text scroll across the page. It was absent in the updated version of the Text Editor (v4.9.3) --- and was left out because it was buggy and was more trouble than it seemed worth.<br />
<br />
However, you can still make text scroll like that by switching to HTML View and putting <marquee> tags around the part you want to scroll, like this...<br />
<br />
<marquee>scroll me</marquee><br />
<br />
[http://www.quackit.com/html/codes/html_marquee_code.cfm Check out this website I found for more on the marquee tag and how you can configure it (e.g., speed, etc).]<br />
<br />
==Put some HTML on a page as a custom code==<br />
Sometimes you try to paste some code in the Soholaunch Text Editor and you can't get it to work right. This typically happens with code that people copy-paste from other providers (like PayPal button code). In most of these cases the Text Editor in soho is trying to interpret the code so you can see what it's output looks like, but if there's javascript in there or something it can through the editor off (because it tries to execute the javascript when it gets to it...with all kinds of quirky results).<br />
<br />
Anyhow, you can avoid all these problems by putting your special code in a custom include and dropping it on your page via the Custom Code object. Any code dropped on the page via the Custom Code object is not interpreted until the page itself is loaded by the site visitor.<br />
<br />
This fixes 99.9% of all "I put the code in the Text Editor but it doesn't work." problems.<br />
<br />
# Go to edit the page where you would like to place the custom HTML.<br />
# Drag & Drop the Custom code item onto the page from the menu.<br />
# Select New file and enter a name for the embed.<br />
# Click Create New File.<br />
# Paste in the HTML.<br />
# Click Save.<br />
# Select the file from the dropdown.<br />
# Click OK.<br />
# Save page<br />
<br />
===Alternate method, create your own #variables# for your custom code===<br />
Sometimes you need custom code to display nested within content that you create using the Text Editor. For example, let's say you have a table with two columns and you want to put normal text in one column and Google ads in the other column.<br />
<br />
For this scenario, using the above method (the Custom Code drag-and-drop object) is less than ideal because you can't get precise placement using the Custom Code method (unless you include the whole table in your custom code, but that's for people who know HTML).<br />
<br />
So with this alternate method, instead of placing the custom html directly on the page, you're going to place a custom placeholder variable where you want the custom code to appear, and then use the [http://wiki.soholaunch.com/index.php?title=UDT_CONTENT_SEARCH_REPLACE UDT_CONTENT_SEARCH_REPLACE] table to replace that placeholder with the actual code when the page loads for the site visitor.<br />
<br />
Here are the steps to follow...<br />
# In the Text Editor place something the text "#mycodewillgohere#" (without the quotes) where you want the custom code to show up. This is going to be your placeholder variable. You can use whatever text you want. For example, it could be #emilyscoolvariable#...it doesn't matter, as long as it's not one of the [http://wiki.soholaunch.com/index.php?title=Custom_Template_Reference#Pound_Variables reserved variables].<br />
# Press the Update button in the Text Editor to apply your changes<br />
# Press the Save Page button.<br />
# Go to the Main Menu<br />
# Click Database Tables<br />
# Under User Tables, View/Edit Records in the UDT_CONTENT_SEARCH_REPLACE table.<br />
# Press the Add New Record button<br />
# For the "Search For" field, enter your placeholder variable (e.g., #mycodewillgohere# or #emilyscoolvariable#)<br />
# For the "Replace With" field, paste in your custom code.<br />
# Save Record.<br />
# View website. Your code should work when the is viewed, but remain as a #variable# while you're editing the page.<br />
<br />
The bonus of this method is that you can now use that #mycodewillgohere# variable ANYWHERE on your website, as many times as you want (instead of having to frequently copy-paste your custom code everywhere, you can just type that variable name).<br />
<br />
==Get started with FTP==<br />
FTP (File Transfer Protocol) is like Windows Explorer for your website's files. Often, especially when you start tinkering with your template html and css, you'll need a way to access files that the Soholaunch tool itself doesn't provide you direct access to....a way to get behind the curtain a little. This is what FTP is for.<br />
<br />
One of the better FTP clients out there is also free. It's called FileZilla. You can download it here...<br />
http://filezilla-project.org/<br />
<br />
In order to get at your template folder...<br />
# Go download filezilla (http://filezilla-project.org/)<br />
# Install it on your computer<br />
# At the top you'll see fields for host, username, and password. For "host" just fill-in your domain name (e.g., example.com). You username and password are typically the same as your cpanel usename and password. If you can't get the right username/password, check the welcome email from your web hosting company. If you can't find that, contact your web hosting company and ask them for you ftp username/password <br />
# Once you're in through ftp, [http://wiki.soholaunch.com/index.php?title=How_to#Find_your_template_folder locate your template folder]<br />
# The two files you are probably looking for are index.html and custom.css. See: [http://wiki.soholaunch.com/index.php?title=Custom_Template_Reference#Template_folder_and_files Template Folder and Files]<br />
# Download the file you want to modify to your PC, make your changes, then upload it back to your site...all though this FileZilla FTP program.<br />
<br />
==Modify your custom.css file==<br />
Most templates --- including all factory templates and most templates available on the [[http://addons.soholaunch.com|Soholaunch Addons]] website --- make use of a file called custom.css. This file contains all (or mostly all) of the styles that affect how your template looks and feels.<br />
<br />
If you want to make color, style, etc changes to your template, chances are what you are looking for is located in your template's custom.css file.<br />
<br />
You can find this file in your template folder.<br />
<br />
==Move your site to a different server==<br />
# Sign-up for new hosting account<br />
# Get temporary access url from your new web hosting company<br />
# Use temporary url to install Soholaunch to new hosting space (via Fantastico or our installsoholaunch.php script)<br />
# Back on your OLD server, log-in to sohoadmin. <br />
# Go to the Webmaster menu.<br />
# Click the Site Mover tool<br />
# Click Move this Site<br />
# Download that file it creates<br />
# On your NEW server, log-in to sohoadmin.<br />
# Go to Webmaster Menu.<br />
# Click Site Mover tool<br />
# Upload your transfer file<br />
# At your domain registrar, re-point your domain name<br />
<br />
==Add a custom redirect to a page==<br />
Here is the code to do a proper (search engine-friendly) redirect. Put this php code in a file, call it "whatever.php", and drop it on the page you want to redirect via the Custom Code object in the Page Editor.<br />
<br />
Make sure to change that "redirectohere.example.com" address.<br />
<br />
<?php<br />
header("HTTP/1.1 301 Moved Permanently");<br />
header("location: http://redirectohere.example.com");<br />
exit;<br />
?><br />
<br />
==Maximize the admin/editing window in Internet Explorer==<br />
The sohoadmin window is designed to run in a fixed size of a little smaller than 800x600 dimensions to make sure it fits on all monitor resolutions.<br />
<br />
However, sometimes it can be handy to be able to make the admin window larger if you have enough screen real-estate to do so. If you are using a browser besides Internet Explorer, like Mozilla FireFox (our recommended browser), then you can simply drag the bottom-right corner of your browser window to resize it. <br />
<br />
But if you're using Internet Explorer then follow these steps...<br />
<br />
1. Log-in to sohoadmin<br />
<br />
2. Close the sohoadmin window after it launches<br />
<br />
3. You should be looking at the "Click here to re-launch admin window" screen.<br />
<br />
4. In the address bar you'll see a URL like this...<br />
http://example.com/sohoadmin/index.php<br />
<br />
5. Change it to this...<br />
http://example.com/sohoadmin/version.php<br />
<br />
6. Hit the Enter key<br />
<br />
7. Admin window will re-launch and be resizeable<br />
<br />
==Add fonts to the new Text Editor==<br />
===CIA Fonts will not work with v4.9.2+===<br />
In versions prior to v4.9.2 there was a plugin called CIA Fonts on the Soholaunch Addons website that made it easy to add fonts to the Text Editor. But as of v4.9.2 this plugin will no longer work (until it is updated...hint, hint Thomas), because v4.9.2+ builds incorporate a completely different text editor. <br />
<br />
===The new workaround method for sites running v4.9.2+===<br />
Until an easier solution is created (which should happen before too long), you can still add fonts to the new editor, but not quite as easily as you could with the old editor and CIA Fonts. <br />
<br />
Here's how to add fonts to the new Text Editor<br />
<br />
;Note: You '''must be running''' at least '''v4.9.2 r7+''' to add fonts using this method...'''<br />
#Go to Database Table Manager<br />
#Click the "System tables" tab<br />
#Find the '''smt_userdata''' table<br />
#Click View/Edit Records<br />
#Using the search box at the top left run a search on "customfonts" (without the qoutes). Only one record should be returned.<br />
#Edit that record<br />
#Add fonts to that "data" field (details below) and hit the Save Changed Data button<br />
<br />
====Format of fonts list====<br />
The "data" field contains a list of all the fonts available in the Text Editor. You may want to copy-paste the content of the data field into a text/code editor like Dreamweaver or MS Notepad so you can see them all on one line instead of wrapped into multiple lines. Then when you're done editing the list just copy-paste it back into the text field you took it out of and save the record.<br />
<br />
''Example content of "data" field in "customfonts" record...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif<br />
<br />
The font choices are separated by semicolon ";". Each font choice has two parts, separated by an equals sign (=). The first part (e.g., Arial) is the font name as it will display in the Text Editor and doesn't matter (i.e., you could call it "Billyfont". The second part is what actually affects what font will show on the website --- the proper font-family syntax for the html/css code. Some fonts in the second part specify multiple comma-separated fonts --- these are alternates to use if the preceding font isn't available.<br />
<br />
Adding "Trebuchet" to the font list...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;Trebuchet=Trebuchet MS,verdana,arial,sans-serif<br />
<br />
Again, the display name doesn't really matter, and the multiple comma-separated alternative fonts are note required either, so could just have...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;MyFavoriteFont=Trebuchet MS<br />
<br />
When you're done editing the font list in the data field just hit the Save Changed Data to update the record and you're done! Your new font will be available in the Text Editor now.<br />
<br />
==Find out what version of Soholaunch you're running==<br />
[[Image:Howto_find_your_version_no.gif]]<br />
<br />
The installed version number is located in the bottom-right of the admin tool window, in the footer.<br />
<br />
==Create an auto-reply email address field in the Web Form builder==<br />
In the form builder...<br />
<br />
#Click the "(+) Add Field" button<br />
#Click the "Email Address" field<br />
<br />
==Uninstall Soholaunch manually==<br />
Note: This will kill the entire website. Do not do this unless you're positive this is what you want to do. This is meant for people who installed Soholaunch manually (i.e. via installsoholaunch.php) on a website they don't want it on and now want to uninstall it.<br />
<br />
Using your preferred code editor (MS Notepad will work if you don't have a code editor of choice), create a new file (save it as deleteitall.php or something) containing this code....<br />
<pre><br />
<?<br />
shell_exec("rm -rf media");<br />
shell_exec("rm -rf images");<br />
shell_exec("rm -rf import");<br />
shell_exec("rm -rf tCustom");<br />
shell_exec("rm -rf template");<br />
shell_exec("rm -rf shopping");<br />
shell_exec("rm -rf sohoadmin");<br />
echo "Done! It's all gone!";<br />
?><br />
</pre><br />
<br />
...now save that file as something like "deleteitall.php", upload it to your document root folder (i.e. public_html, htdocs, etc.) via FTP and point your browser to websiteyouwantokill.com/deleteitall.php.<br />
<br />
==Offer your customers your own template collection==<br />
To make your custom templates available to every user on your server, wrap them all up in a zip file and upload them somewhere...it can be anywhere, as long as it's accessible from the internet.<br />
<br />
For example, let's say you upload your .zip file full of templates to...<br />
ourmaincompanywebsite.com/soho/our_templates.zip<br />
<br />
Then log-in to the Partner Area and go to "Branding Controls". Under "Templates" check the "My own templates" box, for the "URL path to template library .zip..." field fill-in<br />
http://ourmaincompanywebsite.com/soho/our_templates.zip<br />
<br />
Then scroll down and hit the "Save Options" button. Done! From now on whenever a new Soholaunch-powered website is set up on your server(s), your template library will be downloaded and installed automatically.<br />
<br />
==Rename/Delete a page that won't delete==<br />
Usually, if you can't delete a page it's because it has some trouble characters in its name like an ampersand (&) or something. In order to delete the page you'll have to rename it first. And you'll have to rename it "the hard way" because that ampersand won't let you rename it "the easy way" (via Page Properties) for the same reason it won't let you delete the page.<br />
<br />
So here's the step by step for manually renaming a page called "Milo & Otis" to "Milo and Otis" so it won't give you any more problems.<br />
#Go to Main Menu > Database Table Manager<br />
#Select the site_pages table from the drop-down menu<br />
#Hit the "Enter/Edit Record Data" button<br />
#When the table pulls up click the link on the top right that says "Run custom query"<br />
#Put the following tn the text box that pops-up and hit the "Run Query" button...<br />
update site_pages set page_name = 'Milo and Otis' where page_name = 'Milo & Otis'<br />
<br />
Once you follow these steps you should be able to delete, rename, etc the page as normal.<br />
<br />
==Find/Edit custom table search includes==<br />
Via FTP, the files are located here...<br />
[public_html]/media<br />
<br />
File naming convention...<br />
udt-search_[search name].inc<br />
<br />
Example file name...<br />
udt-search_joes_cool_search.inc<br />
<br />
You can download these files to your PC, modify them, then upload them back to that /media folder and you're good to go.<br />
<br />
==Link to specific shopping cart sku==<br />
Go to your website and browse your shopping cart. Click the Buy Now/More Information link for the product you want to link to, then copy the url from your address bar. Should look something like this...<br />
<br />
http://provx.soholaunch.com/shopping/pgm-more_information.php?id=1<br />
<br />
Advanced Note: That id # matches the prikey value of that sku in the cart_products table.<br />
<br />
==Link to specific shopping cart category==<br />
Go to your website and browse your shopping cart. In the search column you'll see a list of links to your categories (in the search column). Click on the link to the category you want, then copy the url from your address bar. Should look something like this...<br />
<br />
http://yourdomain.com/shopping/start.php?browse=1&cat=25<br />
<br />
==Link to specific month/year in you event calendar==<br />
In the text editor, select the text you want to link and hit the little link icon/button next to the paint bucket. Then in the link dialog that pops up, in the field that says "(or) Link / Anchor:" and has "http://" already in the field, do this...<br />
<br />
http://yourdomain.com/About_Us.php?SEL_MONTH=04&SEL_YEAR=2007<br />
<br />
Note: Replace "About_Us" with the name of the page that you dropped you're calendar on, and replace the month and year numbers with whatever month/year you want to jump to.<br />
<br />
==Reset your hit counter==<br />
#Log-in to your site via FTP<br />
#Browse to the "sohoadmin/filebin/" folder<br />
#Delete hitcounter.txt<br />
<br />
==Move license from subdomain to primary domain==<br />
#Log-in to the partner area<br />
#Click on "Lifetime Licenses"<br />
#Delete the license listed for your subdomain<br />
#Click "Add Domain"<br />
#Fill-in the name of your primary domain and click "Generate License"<br />
<br />
==Download page content files==<br />
Via FTP, the files are located here...<br />
[public_html]/sohoadmin/tmp_content<br />
<br />
===What's the difference between CON and REGEN files?===<br />
In short, CON files are for the website-side, REGEN files are for the admin-side. <br />
<br />
;CON files: When a visitor views a page on your website, script files read the CON file for that page and use it to build the final HTML for the page. CON files tell the website-side scripts that you've got a cart item, a login box, and this text on this page.<br />
<br />
;REGEN files: These are used by Soholaunch's Page Editor. When you open a page in Soholaunch to edit it, the REGEN file for that page is read and it tells the product what objects are on the page and which dropzones to display them in.<br />
<br />
When you save a page in the Page Editor, it saves a REGEN file for that page so it knows what edit options to show you in the Page Editor the next time you edit that page, and then it builds a CON file for the page so that the website-side scripts know what to display to site visitors.<br />
<br />
==Upload video files via FTP==<br />
Via FTP, the files are located here...<br />
[public_html]/media<br />
<br />
==Find/Edit the default contact forms==<br />
'''Contact forms'''<br><br />
Via FTP, the files are located here...<br />
[public_html]/sohoadmin/program/modules/page_editor/formlib/forms<br />
<br />
The files are:<br />
*Contact_Form_(Basic).form<br />
*General_Email_Form.form<br />
<br />
'''Newsletter quick signup form'''<br><br />
The file for this is located here...<br />
[public_html]/sohoadmin/program/modules/page_editor/formlib/newsletter/Quick-N-Easy_Signup.form<br />
<br />
'''Points to remember:'''<br />
*Though they're technicaly just html files, make sure to preserve the .form extension when you upload them back to your site so the system can recognize them (which is the whole idea behind the .form extension --- so know it's a form).<br />
<br />
==Find your template folder==<br />
'''1. Log-in via FTP to your website and navigate to this folder...'''<br />
public_html/sohoadmin/program/modules/site_templates/pages/<br />
<br />
'''2. Find the folder for your specific template.'''<br />
This is the naming convention for template folders..<br />
CATEGORY-Template_Name-Color<br />
<br />
So if you're using CORPORATE > A_Curvacious_Mark (Blue), your template folder would be...<br />
CORPORATE-A_Curvacious_Mark-Blue<br />
<br />
...and the full path from your home directory would be:<br />
public_html/sohoadmin/program/modules/site_templates/pages/CORPORATE-A_Curvacious_Mark-Blue<br />
<br />
==Swap out your template header text for a logo image==<br />
1. Download the '''index.html''' file from your [[#Find your template folder|template folder]]<br />
<br />
2. Find (ctrl+f) '''"#LOGO#"'''<br />
<br />
3. Replace it with '''"#LOGOIMG#"'''<br />
<br />
4. Save the file and upload it back to your template folder<br />
<br />
You can now add and change the logo image in your template via Template Manager (where it says choose logo image). <br />
<br />
The same logic applies if you want to change your logo text to something else or add other information right around it. For example, if your template allows for header text via #LOGO# and you want slogan text too, you could find that #LOGO# in your template's .html file but instead of replacing it with #LOGOIMG# you could change it to something like...<br />
<br />
'''Example: Apply same logic to add slogan text'''<br />
<br />
''Original line in template's index.html file...''<br />
#LOGO#<br />
<br />
''Add a line break and the pound-variable for slogan text...''<br />
#LOGO#<br>#SLOGAN#<br />
<br />
Complete list of available pound variables like #LOGO#, #LOGOIMG#, and #SLOGAN#, see [[Custom_Template_Reference|custom template reference]].<br />
<br />
==Set background image==<br />
1. '''Log-in via FTP and find your template's folder...'''<br />
<br />
2. '''Upload the image you want to use''' as your background to that folder<br />
<br />
3. '''Download the custom.css file''' that's in there and open it up in your code editor of choice (or notepad will work if nothing else)<br />
<br />
4. '''Add in this code...'''<br />
body { background-image: url(mybackgroundimage.gif); }<br />
<br />
5. '''Save the file (custom.css)''' and upload it back to your template's folder<br />
<br />
==Make a button that links to another website, but opens that link in a new window==<br />
<br />
'''Solution:''' Pull up the Text Editor where you put in the button, click on the "HTML" button at the bottom left. <br />
<br />
The HTML for your button should look something like this...<br />
<pre><input type="button" style="width: 163px; color: <br />
rgb(29, 0, 237); height: 24px; background-color: rgb(249, 186, 0);"<br />
size="217" value="Click here to go to example.com"></pre><br />
<br />
To make this button link to "www.example.com", insert the following "onclick" attribute...<br />
<pre>onclick="window.open('http://www.example.com','', <br />
'width=800px,height=600px,resizable');"</pre><br />
<br />
So the full code for the button should look something like...<br />
<pre><input type="button" onclick="window.open('http://www.example.com','',<br />
'width=800px, height=600px,resizable');"<br />
style="width: 163px; color: rgb(29, 0, 237); <br />
height: 24px; background-color: rgb(249, 186, 0);" <br />
size="217" value="My Button"></pre><br />
<br />
Just replace "www.example.com" with the site you want to link to, and you're good to go.<br />
<br />
==Install Soholaunch on a subdomain manually via cPanel==<br />
How to install manually on subdomain....<br />
<br />
http://soholaunch.com<br />
# Download installer<br />
<br />
cPanel<br />
# Create database<br />
# Create user<br />
# Add user to database<br />
<br />
Local PC<br />
# Extract installsoholaunch.zip somewhere<br />
<br />
FTP Client<br />
# Upload installsoholaunch.php to root of subfolder for subdomain (e.g., "public_html/fr" for "fr.domain.com")<br />
<br />
Browser<br />
# Go to yourdomain.com/installsoholaunch.php<br />
# Click install button<br />
# Fill-out setup form with database info (db name, username, password you just created in cPanel)<br />
# Done installing!<br />
<br />
==Import a large number of shopping cart items at once==<br />
# Log-in to sohoadmin (yourdomain.com/sohoadmin)<br />
# Main Menu > Database Tables > System Tables tab<br />
# Scroll until you see the "cart_products" table. If it does not exist, return to the Main Menu and click the Shopping Cart icon once, wait for the Shopping Cart menu to load (the one with buttons that say things like Shipping Options, Find/Edit Products, Tax Options, etc), and then go back to Database Tables > System Tables (so basically start over at step #2 above).<br />
# Next to the "cart_products" name you'll see a Download link. Click that to download the table in CSV format.<br />
# Open Microsoft Excel, create a new spreadsheet<br />
# In Excel, do this: Data > Import External Data > (select the file you downloaded) > Semicolon delimited > Finish<br />
# Now you have all the right column names set up in your spreadsheet, you can start filling it out with all your product info.<br />
# When you've got it filled out, Save As > CSV file (semicolon delimited) > Yes on the warning prompt about losing funcitonality<br />
# Back in sohoadmin, go to Main Menu > File Manager > Upload Files<br />
# Upload the .csv file you just saved your spreadsheet to.<br />
# Go back to sohoadmin > Main Menu > Database Tables > System tables tab<br />
# Next to cart_products, click the Import link. <br />
# Select the CSV file you uploaded, then follow the prompts to make sure that your column names match up.<br />
# Once you finish the Import action, you're all done!<br />
<br />
'''Note1:''' If you already have a spreadsheet full of shopping cart items, skip to step 8<br />
<br />
'''Note2:''' The PROD_CATEGORY fields use the keyfield numbers from the cart_category table, which you can also view via Database Tables > System Tables tab > View/Edit Records<br />
<br />
'''Note3:''' You can also use this import feature to ''update'' many cart items at one time.<br />
<br />
'''Note4:''' Always use the Backup/Restore to make a backup first!<br />
<br />
==Transfer shopping cart items from one site to another==<br />
<br />
sohoadmin for Main site (e.g, yourdomain.com)<br />
# Database Tables feature<br />
# System Tables<br />
# cart_products<br />
# Click the download link<br />
# Save that somewhere on your PC<br />
<br />
sohoadmin for subdomain (e.g., fr.yourdomain.com)<br />
# File Manager<br />
# Upload Files<br />
# Upload csv file that you downloaded<br />
# Database Tables<br />
# System Tables<br />
# cart_products<br />
# Import<br />
# Follow instructions<br />
<br />
==Make blog sort by earliest-to-latest, instead of latest-to-earliest.==<br />
1. Log-in via FTP, browse to your public_html folder<br />
<br />
2. Download pgm-blog_display.php<br />
<br />
3. Modify sort order by finding this line...<br />
$blog_qry = "ORDER BY timestamp DESC, PRIKEY DESC LIMIT 15"; // Limit by 15<br />
<br />
to this...<br />
$blog_qry = "ORDER BY timestamp DESC, PRIKEY ASC LIMIT 15"; // Limit by 15<br />
<br />
4. To be safe, find all other instances of "DESC" and replace them with "ASC".<br />
<br />
5. Save. Upload your modified pgm-blog_display.php TO YOUR TEMPLATE FOLDER. If Soholaunch finds a pgm-blog_display.php in your template folder, it will use it instead of the standard file.<br />
<br />
==Enable pre-release testing builds==<br />
Sometimes we will release small version updates to address specific problems on client websites (or to test new features). You can think of these builds as "nightly" or "beta" builds. They come with no guarantees about reliability, and you should not update to them unless you are installing on a development site, or unless a member of the Soholaunch support staff tells you to update to it.<br />
<br />
By default, you cannot see these beta builds in the Software Updates feature. You need to enable them. Here's how to do that...<br />
# From your sohoadmin control panel, go here: Main Menu > Webmaster > Software Updates<br />
# Click the link that looks like this: "[?] Technical diagnostic info (for geeks)"<br />
# This will open a popup layer. Look at the bottom of the popup.<br />
# Set this option to "Yes/Enabled": "Enable pre-release testing builds"<br />
# Close popup and click the Check For Updates button again<br />
# You should see the beta build listed as available to install (note a beta build is not always available).<br />
<br />
==Create a database with cPanel==<br />
All Soholaunch installations require a database, along with an associated database user/pass. Here's how to create a MySQL database and assign a user to it using cPanel.<br />
<br />
===Step 1: Create the Database===<br />
# Log-in to cPanel (yourdomain.com/cpanel)<br />
# Find the icon for MySQL Databases. Click it.<br />
# Under the Create New Database heading, fill in a name in the text field (note that usually every database is prefixed with your cPanel username, which is shown before the text field). Usually, I just type in "soho" for the database name, making the full database name "[username]_soho"<br />
# Click the Create New Database button.<br />
# Now your database is created.<br />
<br />
===Step 2: Create a User===<br />
Now you need to create a user/pass for the database.<br />
# Still on the MySQL Databases page, scroll down under Add New User.<br />
# Fill in a name. This is like the database name. You're only going to use it once and you won't need to remember it for more than the next 5 minutes. Keep it short and use letters only.<br />
# Note: Like the database name, the username is prefixed is by your cPanel username.<br />
# For the password, just use the password generator and copy it down somewhere temporary. Again, you will only need this password for the next 5 minutes of your life.<br />
# Click the Create User button.<br />
<br />
===Assign the user to the database===<br />
*Why this is necessary:* In case you're curious as to why we have to do this: All you've done so far is create a user for the database. Right now, this user has no authority. He's just an empty shell of a user, lonely and without a database to work on. You need to associate this new user with the database.<br />
<br />
# Scroll down to the Add User to Database section (underneath where you created the user).<br />
# Select the name of the user you just created from the first dropdown.<br />
# Select the name of the database you created in Step 1 from the second dropdown.<br />
# Click the Add button<br />
# Check the box for All Privileges<br />
# Click the Add button<br />
# All done!</div>Sohohttps://wiki.soholaunch.com/index.php?title=How_toHow to2013-12-27T16:24:25Z<p>Soho: /* Use an Authorize.net reseller for your payment gateway */</p>
<hr />
<div>==Create a Foundation/Boostrap compatible template==<br />
<br />
Foundation and Bootstrap are the two reigning HTML frameworks for creating responsive HTML and CSS. Ultra is fully-compatible with both Foundation and Bootstrap, where as Pro is mostly compatible. There are two main steps to creating Bootstrap and Foundation-compatible Soholaunch templates.<br />
<br />
1. Create the template design via Bootstrap or Foundation (of those two, I recommend Foundation).<br />
<br />
2. Add the soho #variables# like you normally do.<br />
<br />
3. In Ultra, you're be done now. <br />
<br />
The rest of these instructions only apply if you're using Soholaunch Pro.<br />
<br />
4. NAV MENU: Make a copy of the pgm-auto_menu.php file and add the Foundation or Bootstrap classes to the html that gets outputted for your navigation menu.<br />
<br />
5. CONTENT AREA: Pro uses an HTML table to produce the Page Editor's grid structure. This hard-width table will prevent responsive frameworks like Bootstrap/Foundation from collapsing content on mobile devices. To overcome this, you'll need to target this table with Javascript change it's display structure to be a normal block elements.<br />
<br />
==Use an Authorize.net reseller for your payment gateway==<br />
Many payment gateways are resellers of the popular Authorize.net payment gateway. They may offer better rates and packages, but ultimately they're selling the same technology, except that they use a different URL address for accepting payments. Both Soholaunch Pro and Soholaunch Ultra include a simple, built-in way to change the gateway URL on soho's built-in Authorize.net integration so that you can use Authorize.net reseller gateways.<br />
<br />
===How to change the Authorize===<br />
The Authorize.net gateway URL is composed of two parts...<br />
# The hostname: secure.authorize.net<br />
# The path: /gateway/transact.dll<br />
<br />
These are the two variables that you need to adjust to use your reseller gateway. You can add custom URL and path to the Soholaunch smt_userdata table using special variable names, and Soholaunch will use your custom host and path instead.<br />
<br />
# Go to the Database Tables feature<br />
# Click the System Tables tab.<br />
# Find the smt_userdata table<br />
# Click View/Edit Records<br />
# Add New Record<br />
# prikey (leave blank), plugin = 'cart_authorize', fieldname = 'scHost', data = '[your custom url]' (all those values should be typed WITHOUT the single quotes)<br />
# Save New Record<br />
# Add New Record<br />
# prikey (leave blank), plugin = 'cart_authorize', fieldname = 'scPath', data = '[your custom path]'<br />
# Save New Record<br />
# All done!<br />
<br />
==Add an XML Sitemap to your website==<br />
'''Part one: Generate a sitemap'''<br />
# Visit [http://xml-sitemaps.com xml-sitemaps.com]<br />
# Follow-the instructions to generate an XML sitemap for your site.<br />
# Copy the sitemap it generates (Ctrl+c)<br />
# Open MS Notepad (or Typepad on a Mac)<br />
# Paste in your sitemap (Ctrl+v)<br />
# Save the file as sitemap.xml<br />
<br />
'''Part two: Upload sitemap'''<br />
# Log-in to your sohoadmin<br />
# From the Main Menu, press the F4 key to launch the secret super-tool.<br />
# This screen may look scary, but it will help you upload the sitemap to your home folder.<br />
# Make sure the path at the top shows that you are in the public_html folder<br />
# Click the upload button to select the sitemap.xml file from your computer and upload it<br />
# All done!<br />
<br />
==Verify your site with Google Webmaster Tools==<br />
'''Part one: Add site to your Google account'''<br />
# Log-in to your Google Account<br />
# Go to Google Webmaster Tools<br />
# Click Add a Site<br />
# Click Manage site > Verify this site<br />
# Click the link to Download the HTML verification file<br />
# Save that file to your computer somewhere<br />
<br />
'''Part two: Upload verification file'''<br />
# Log-in to your sohoadmin<br />
# From the Main Menu, press the F4 key to launch the secret super-tool.<br />
# This screen may look scary, but it will help you upload Google's file to your home folder.<br />
# Make sure the path at the top shows that you are in the public_html folder<br />
# Click the upload button to select the Google file from your computer and upload it<br />
<br />
'''Part three: Finalize verification'''<br />
# Go back to Google Webmaster Tools<br />
# Click Verify<br />
# Done!<br />
<br />
==Put a text link on top of an image==<br />
There are a couple ways to put a link on top of an image. Here are two methods.<br />
<br />
===1. Overlay a normal text link on an image.===<br />
The idea here is to set your image as a background image for an element that contains your text link. <br />
<br />
So let's say you have an image called...<br />
kitten.jpg (300px width X 150px height)<br />
<br />
...and you want to lay a text link on it. What you're going to do is create a container element in html that has the same width and height as your image, assign your image to be the background image, and then put your text inside the container element. <br />
<br />
Flip over to the Text Editor's HTML view (you should also do this as a custom code file) and put in some html like below. You can copy-paste this if you'd like.<br />
<pre><br />
<div style="width: 300px;height: 150px;background-image: url('images/kitten.jpg');"><br />
<a href="http://example.com/Kittens.php">Click here to see kittens</a><br />
</div><br />
</pre><br />
<br />
===2. Create an image map===<br />
An image map is a combination of image and code that basically makes certain sections of the image clickable like links. You typically define the sections through a graphical image map maker. There are lots of free standalone products, and image mapping is a built in tool for most major web development software packages (e.g., Adobe Dreamweaver). <br />
<br />
Note that once you use such a program to create an image map, it will give you a bunch of code to insert on your page. Use Soholaunch's "Custom Code" drag-and-drop object to put that on your page.<br />
<br />
===3. Use absolute positioning with CSS===<br />
This is the "advanced" method. If you don't already know what this is, it will take more than a paragraph to explain it well. Going in-depth into CSS positioning would be a little out-of-scope for this page, and lots of people on the web have already done a great job explaining it. But if you're interested and you're the tinkering type, search around for [http://lmgtfy.com/?q=css+positioning+tutorial tutorials on CSS positioning]. You may want to do a few CSS primers first if you've never looked at it before.<br />
<br />
==Install Google Analytics code on your website==<br />
Google Analytics is an ultra-powerful stats package provided by Google for analyzing your website traffic. It will give you a dazzling amount of information about your site visitors.<br />
<br />
To use Google Analytics with your website, you must add Google's special tracking code to all of your site pages. Because Soholaunch uses templates (one master file that controls the style for your whole website), you don't have to worry about adding it to all your pages. You can just add it in one place and be done with it.<br />
<br />
There are two easy ways to add Google's code to your Soholaunch-powered website:<br />
<br />
===1. The Easy Way: Grab a plugin===<br />
Go try one of the [http://addons.soholaunch.com/?pr=Plugins&search_qry=analytics several Google Analytics plugins] available at [http://addons.soholaunch.com Soholaunch Addons]: <br />
<br />
===2. The Hard Way: Edit your template file===<br />
# [http://wiki.soholaunch.com/index.php?title=How_to#Find_your_template_folder First, find your template folder] through [http://wiki.soholaunch.com/index.php?title=How_to#Get_started_with_FTP FTP]<br />
# Locate the index.html file within your template folder<br />
# Follow Google's instructions for adding the code.<br />
# Also note that if your template folder contains a home.html file, you will need to add the Google Code there as well.<br />
<br />
==Export shopping cart products==<br />
Using the Database Tables feature it is possible to export your shopping cart products into a semicolon-delimited .csv file that you can then import into spreadsheets (e.g., Microsoft Excel) and many other systems. <br />
<br />
Here are instructions for exporting your shopping cart products:<br />
# Log-in to sohoadmin<br />
# From the Main Menu, click the Database Tables icon.<br />
# Click the System Tables tab<br />
# Find the "cart_products" table.<br />
# Click the "Download" link.<br />
# Save the file to your local computer<br />
<br />
==Prevent PayPal Order Number Conflicts==<br />
If you are using one paypal account to accept orders on more than one Soholaunch website, you may run into order number conflicts. This usually manifests in an error from PayPal that says something like "Order already exists". <br />
<br />
===The problem===<br />
The Soholaunch Shopping Cart starts it's order numbers off at 10000 and counts up one at a time per order, so your third order will be order #10003. When you use PayPal as your payment gateway, this order number is passed to paypal as the unique identifier number for PayPal.<br />
<br />
Normally, when you just have one website, this is all fine and dandy. But when you have two websites running through the same PayPal account, you start to get conflicts. If you've received three orders from Site A and three orders from Site B, the third order on both sites is going to pass to PayPal as #10003. When the Site B tries to run its third order through, PayPal says "Hey, no...that order number already exists" (because Site A used it earlier).<br />
<br />
===How to fix it===<br />
The fix for the duplicate order number problem is simple enough. You just need to jump the order numbers on one of your site to another range, so that the two order number ranges don't ever overlap.<br />
<br />
You can leave Site A alone in it's 10000 range. For Site B, do this...<br />
# Main Menu<br />
# Database Tables<br />
# System Tables tab<br />
# cart_invoices<br />
# View/Edit Records<br />
# Add New Record<br />
# Specify a really high number like 200000 for the ORDER_NUMBER<br />
# Leave all the other fields blank<br />
# Save<br />
# View table and delete your test record (if you want)<br />
# From now on order numbers will start at whatever number you put in (e.g., 200000)<br />
<br />
==Use special characters in your navigation menu links==<br />
<br />
Soholaunch does not currently support using special characters (anything besides letters, numbers, and spaces) in your site's menu navigation, neither in main page links nor in sub page links.<br />
<br />
Although we are working to improve this in future versions so that you can use whatever characters you want, there are ways to get around the current restriction in the mean time.<br />
<br />
===Method #1: Search and Replace Table===<br />
Let's assume you want to create a page called Lilo & Stitch. Normally, that ampersand will make the Soholaunch paging system <br />
<br />
# Name your page something that works under the standard page naming restrictions, so let's say "Lilo and Stitch".<br />
# Go Main Menu > Database Tables > User Tables > UDT_CONTENT_SEARCH_REPLACE > View/Edit Records<br />
# Add a Record<br />
# Search for: "Lilo and Stitch" (without the quotes)<br />
# Replace with: "Lilo & Stitch" (without the quotes)<br />
<br />
===Method #2: Hard code your menu===<br />
If you are comfortable modifying the html file for your template, you can certainly hard-code your menu navigation directly into the HTML file and use whatever special characters you want.<br />
<br />
==Copy-Paste Content from Microsoft Word==<br />
Pasting from MS Word is always a problem for WYSIWYG editors like the Soholaunch Text Editor, because the content that you copy from Word carries all of this crappy Microsoft psuedo-html code with it. Some of that code works; some of it can't be interpreted by the browser. Hence the funky, half-working result you end up with a lot of times.<br />
<br />
To combat this, we recommend two options:<br />
<br />
1. Instead of normal pasting (Ctrl+V or right-click, paste), use the Paste from Word button inside the Soholaunch Text Editor. Note that this button does not work in FireFox (not for lack of trying). When you hit that button, the soho editor will try to translate the odd MS Word code into to real html code, which will usually yield a bit better results than just normal pasting.<br />
<br />
2. Strip all the formatting before you paste. As in, copy the content from MS Word, paste it in a bare-bones text editor like MS Notepad, then copy from there in to the soho editor and format as you like. This is certainly the most reliable, quirk-free method, though it does require you to re-do your formatting.<br />
<br />
==How to find your FTP login==<br />
If you submit support tickets with us, we will usually ask you for your "FTP" login username and password. If your web hosting company offers "cPanel", then this username/password is probably the same as your "cPanel" user name and password. You usually find this log-in information in the "Welcome" email that your web hosting company sent you when you first signed up with them.<br />
<br />
==How to fix a corrupt page==<br />
Sometimes certain content on a page will break the page editor. Often you don't know this is happening until it's too late and your page is corrupted. <br />
<br />
Symptoms of a corrupt page:<br />
* Page Editor: Fails to load<br />
* Page Editor: Cannot delete objects<br />
* Page Editor: Not all grid squares display<br />
* Page does not display correctly (or at all)<br />
<br />
Cause of corrupt page: Code or script that you have copy-pasted from elsewhere is messing with the page editor.<br />
<br />
If this happens to you the best thing to do is create a new page, then re-place your content from the broken page one element at a time. Of special note: To be extra safe, put all suspicious content on the page using the Custom Code object (which prevents the Page Editor from trying to interpret it).<br />
<br />
Note: Again, the cause of corrupt pages is almost always broken html code that you have copy-pasted, or javascript that you have copy-pasted into the Text Editor. If you need to put javascript or other special code on the page, do it with the Custom Code object.<br />
<br />
Note2: You may have to completely delete the original page and start over.<br />
<br />
Related: [http://wiki.soholaunch.com/index.php?title=How_to#Put_some_HTML_on_a_page_as_a_custom_code How to place something on a page as custom code]<br />
<br />
==How to add anchor links==<br />
Here is how you install anchors to text in Soholaunch:<br />
<br />
# In the text editor, place your cursor at the place where you would like the anchor. Click the anchor button and create a short, single word name for the anchor. Click Insert.<br />
# Now go to the text you would like linked to that anchor and select (highlight) the text.<br />
# Click the insert/edit link button. in the Anchors dropdown select the correct anchor for the text and click insert.<br />
<br />
That should help you. Keep in mind that you create the anchor first and then link text to the anchor. Also, anchors are only valid within the same text editor. If you have multiple text boxes on a page the anchors will not work between separate text boxes.<br />
<br />
==Update to the latest version==<br />
From the Main Menu of /sohoadmin...<br />
# Click the Webmaster buttton on the top nav<br />
# Click the Software Updates button<br />
# Click the big "Check for Updates Now" button<br />
# Select the build you want to install<br />
# Click "Install"<br />
<br />
==Download new language translation files==<br />
Translations of the Soholaunch product are now handled at http://translate.soholuaunch.com. If you speak multiple languages and want to help translate Soholaunch, you can go to that site, sign up for a free account, and start translating immediately.<br />
<br />
At any time you can download the latest language file for a given language. Here's how...<br />
# Go to http://translate.soholaunch.com<br />
# Sign-up/Log-in<br />
# Set language to the language you want to download (e.g., Hebrew)<br />
# Click link at top-left to download latest translation files<br />
<br />
Once you have downloaded the latest language file you can add it to your Soholaunch-powered website by logging-in via FTP, and uploading the hebrew.php (or spanish.php, or whatever.php) file you downloaded to this folder...<br />
public_html/sohoadmin/language<br />
<br />
==Make text scroll like a marquee==<br />
The old Text Editor (< v4.9.3) used to include a "marquee" feature that would allow you to make any block of text scroll across the page. It was absent in the updated version of the Text Editor (v4.9.3) --- and was left out because it was buggy and was more trouble than it seemed worth.<br />
<br />
However, you can still make text scroll like that by switching to HTML View and putting <marquee> tags around the part you want to scroll, like this...<br />
<br />
<marquee>scroll me</marquee><br />
<br />
[http://www.quackit.com/html/codes/html_marquee_code.cfm Check out this website I found for more on the marquee tag and how you can configure it (e.g., speed, etc).]<br />
<br />
==Put some HTML on a page as a custom code==<br />
Sometimes you try to paste some code in the Soholaunch Text Editor and you can't get it to work right. This typically happens with code that people copy-paste from other providers (like PayPal button code). In most of these cases the Text Editor in soho is trying to interpret the code so you can see what it's output looks like, but if there's javascript in there or something it can through the editor off (because it tries to execute the javascript when it gets to it...with all kinds of quirky results).<br />
<br />
Anyhow, you can avoid all these problems by putting your special code in a custom include and dropping it on your page via the Custom Code object. Any code dropped on the page via the Custom Code object is not interpreted until the page itself is loaded by the site visitor.<br />
<br />
This fixes 99.9% of all "I put the code in the Text Editor but it doesn't work." problems.<br />
<br />
# Go to edit the page where you would like to place the custom HTML.<br />
# Drag & Drop the Custom code item onto the page from the menu.<br />
# Select New file and enter a name for the embed.<br />
# Click Create New File.<br />
# Paste in the HTML.<br />
# Click Save.<br />
# Select the file from the dropdown.<br />
# Click OK.<br />
# Save page<br />
<br />
===Alternate method, create your own #variables# for your custom code===<br />
Sometimes you need custom code to display nested within content that you create using the Text Editor. For example, let's say you have a table with two columns and you want to put normal text in one column and Google ads in the other column.<br />
<br />
For this scenario, using the above method (the Custom Code drag-and-drop object) is less than ideal because you can't get precise placement using the Custom Code method (unless you include the whole table in your custom code, but that's for people who know HTML).<br />
<br />
So with this alternate method, instead of placing the custom html directly on the page, you're going to place a custom placeholder variable where you want the custom code to appear, and then use the [http://wiki.soholaunch.com/index.php?title=UDT_CONTENT_SEARCH_REPLACE UDT_CONTENT_SEARCH_REPLACE] table to replace that placeholder with the actual code when the page loads for the site visitor.<br />
<br />
Here are the steps to follow...<br />
# In the Text Editor place something the text "#mycodewillgohere#" (without the quotes) where you want the custom code to show up. This is going to be your placeholder variable. You can use whatever text you want. For example, it could be #emilyscoolvariable#...it doesn't matter, as long as it's not one of the [http://wiki.soholaunch.com/index.php?title=Custom_Template_Reference#Pound_Variables reserved variables].<br />
# Press the Update button in the Text Editor to apply your changes<br />
# Press the Save Page button.<br />
# Go to the Main Menu<br />
# Click Database Tables<br />
# Under User Tables, View/Edit Records in the UDT_CONTENT_SEARCH_REPLACE table.<br />
# Press the Add New Record button<br />
# For the "Search For" field, enter your placeholder variable (e.g., #mycodewillgohere# or #emilyscoolvariable#)<br />
# For the "Replace With" field, paste in your custom code.<br />
# Save Record.<br />
# View website. Your code should work when the is viewed, but remain as a #variable# while you're editing the page.<br />
<br />
The bonus of this method is that you can now use that #mycodewillgohere# variable ANYWHERE on your website, as many times as you want (instead of having to frequently copy-paste your custom code everywhere, you can just type that variable name).<br />
<br />
==Get started with FTP==<br />
FTP (File Transfer Protocol) is like Windows Explorer for your website's files. Often, especially when you start tinkering with your template html and css, you'll need a way to access files that the Soholaunch tool itself doesn't provide you direct access to....a way to get behind the curtain a little. This is what FTP is for.<br />
<br />
One of the better FTP clients out there is also free. It's called FileZilla. You can download it here...<br />
http://filezilla-project.org/<br />
<br />
In order to get at your template folder...<br />
# Go download filezilla (http://filezilla-project.org/)<br />
# Install it on your computer<br />
# At the top you'll see fields for host, username, and password. For "host" just fill-in your domain name (e.g., example.com). You username and password are typically the same as your cpanel usename and password. If you can't get the right username/password, check the welcome email from your web hosting company. If you can't find that, contact your web hosting company and ask them for you ftp username/password <br />
# Once you're in through ftp, [http://wiki.soholaunch.com/index.php?title=How_to#Find_your_template_folder locate your template folder]<br />
# The two files you are probably looking for are index.html and custom.css. See: [http://wiki.soholaunch.com/index.php?title=Custom_Template_Reference#Template_folder_and_files Template Folder and Files]<br />
# Download the file you want to modify to your PC, make your changes, then upload it back to your site...all though this FileZilla FTP program.<br />
<br />
==Modify your custom.css file==<br />
Most templates --- including all factory templates and most templates available on the [[http://addons.soholaunch.com|Soholaunch Addons]] website --- make use of a file called custom.css. This file contains all (or mostly all) of the styles that affect how your template looks and feels.<br />
<br />
If you want to make color, style, etc changes to your template, chances are what you are looking for is located in your template's custom.css file.<br />
<br />
You can find this file in your template folder.<br />
<br />
==Move your site to a different server==<br />
# Sign-up for new hosting account<br />
# Get temporary access url from your new web hosting company<br />
# Use temporary url to install Soholaunch to new hosting space (via Fantastico or our installsoholaunch.php script)<br />
# Back on your OLD server, log-in to sohoadmin. <br />
# Go to the Webmaster menu.<br />
# Click the Site Mover tool<br />
# Click Move this Site<br />
# Download that file it creates<br />
# On your NEW server, log-in to sohoadmin.<br />
# Go to Webmaster Menu.<br />
# Click Site Mover tool<br />
# Upload your transfer file<br />
# At your domain registrar, re-point your domain name<br />
<br />
==Add a custom redirect to a page==<br />
Here is the code to do a proper (search engine-friendly) redirect. Put this php code in a file, call it "whatever.php", and drop it on the page you want to redirect via the Custom Code object in the Page Editor.<br />
<br />
Make sure to change that "redirectohere.example.com" address.<br />
<br />
<?php<br />
header("HTTP/1.1 301 Moved Permanently");<br />
header("location: http://redirectohere.example.com");<br />
exit;<br />
?><br />
<br />
==Maximize the admin/editing window in Internet Explorer==<br />
The sohoadmin window is designed to run in a fixed size of a little smaller than 800x600 dimensions to make sure it fits on all monitor resolutions.<br />
<br />
However, sometimes it can be handy to be able to make the admin window larger if you have enough screen real-estate to do so. If you are using a browser besides Internet Explorer, like Mozilla FireFox (our recommended browser), then you can simply drag the bottom-right corner of your browser window to resize it. <br />
<br />
But if you're using Internet Explorer then follow these steps...<br />
<br />
1. Log-in to sohoadmin<br />
<br />
2. Close the sohoadmin window after it launches<br />
<br />
3. You should be looking at the "Click here to re-launch admin window" screen.<br />
<br />
4. In the address bar you'll see a URL like this...<br />
http://example.com/sohoadmin/index.php<br />
<br />
5. Change it to this...<br />
http://example.com/sohoadmin/version.php<br />
<br />
6. Hit the Enter key<br />
<br />
7. Admin window will re-launch and be resizeable<br />
<br />
==Add fonts to the new Text Editor==<br />
===CIA Fonts will not work with v4.9.2+===<br />
In versions prior to v4.9.2 there was a plugin called CIA Fonts on the Soholaunch Addons website that made it easy to add fonts to the Text Editor. But as of v4.9.2 this plugin will no longer work (until it is updated...hint, hint Thomas), because v4.9.2+ builds incorporate a completely different text editor. <br />
<br />
===The new workaround method for sites running v4.9.2+===<br />
Until an easier solution is created (which should happen before too long), you can still add fonts to the new editor, but not quite as easily as you could with the old editor and CIA Fonts. <br />
<br />
Here's how to add fonts to the new Text Editor<br />
<br />
;Note: You '''must be running''' at least '''v4.9.2 r7+''' to add fonts using this method...'''<br />
#Go to Database Table Manager<br />
#Click the "System tables" tab<br />
#Find the '''smt_userdata''' table<br />
#Click View/Edit Records<br />
#Using the search box at the top left run a search on "customfonts" (without the qoutes). Only one record should be returned.<br />
#Edit that record<br />
#Add fonts to that "data" field (details below) and hit the Save Changed Data button<br />
<br />
====Format of fonts list====<br />
The "data" field contains a list of all the fonts available in the Text Editor. You may want to copy-paste the content of the data field into a text/code editor like Dreamweaver or MS Notepad so you can see them all on one line instead of wrapped into multiple lines. Then when you're done editing the list just copy-paste it back into the text field you took it out of and save the record.<br />
<br />
''Example content of "data" field in "customfonts" record...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif<br />
<br />
The font choices are separated by semicolon ";". Each font choice has two parts, separated by an equals sign (=). The first part (e.g., Arial) is the font name as it will display in the Text Editor and doesn't matter (i.e., you could call it "Billyfont". The second part is what actually affects what font will show on the website --- the proper font-family syntax for the html/css code. Some fonts in the second part specify multiple comma-separated fonts --- these are alternates to use if the preceding font isn't available.<br />
<br />
Adding "Trebuchet" to the font list...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;Trebuchet=Trebuchet MS,verdana,arial,sans-serif<br />
<br />
Again, the display name doesn't really matter, and the multiple comma-separated alternative fonts are note required either, so could just have...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;MyFavoriteFont=Trebuchet MS<br />
<br />
When you're done editing the font list in the data field just hit the Save Changed Data to update the record and you're done! Your new font will be available in the Text Editor now.<br />
<br />
==Find out what version of Soholaunch you're running==<br />
[[Image:Howto_find_your_version_no.gif]]<br />
<br />
The installed version number is located in the bottom-right of the admin tool window, in the footer.<br />
<br />
==Create an auto-reply email address field in the Web Form builder==<br />
In the form builder...<br />
<br />
#Click the "(+) Add Field" button<br />
#Click the "Email Address" field<br />
<br />
==Uninstall Soholaunch manually==<br />
Note: This will kill the entire website. Do not do this unless you're positive this is what you want to do. This is meant for people who installed Soholaunch manually (i.e. via installsoholaunch.php) on a website they don't want it on and now want to uninstall it.<br />
<br />
Using your preferred code editor (MS Notepad will work if you don't have a code editor of choice), create a new file (save it as deleteitall.php or something) containing this code....<br />
<pre><br />
<?<br />
shell_exec("rm -rf media");<br />
shell_exec("rm -rf images");<br />
shell_exec("rm -rf import");<br />
shell_exec("rm -rf tCustom");<br />
shell_exec("rm -rf template");<br />
shell_exec("rm -rf shopping");<br />
shell_exec("rm -rf sohoadmin");<br />
echo "Done! It's all gone!";<br />
?><br />
</pre><br />
<br />
...now save that file as something like "deleteitall.php", upload it to your document root folder (i.e. public_html, htdocs, etc.) via FTP and point your browser to websiteyouwantokill.com/deleteitall.php.<br />
<br />
==Offer your customers your own template collection==<br />
To make your custom templates available to every user on your server, wrap them all up in a zip file and upload them somewhere...it can be anywhere, as long as it's accessible from the internet.<br />
<br />
For example, let's say you upload your .zip file full of templates to...<br />
ourmaincompanywebsite.com/soho/our_templates.zip<br />
<br />
Then log-in to the Partner Area and go to "Branding Controls". Under "Templates" check the "My own templates" box, for the "URL path to template library .zip..." field fill-in<br />
http://ourmaincompanywebsite.com/soho/our_templates.zip<br />
<br />
Then scroll down and hit the "Save Options" button. Done! From now on whenever a new Soholaunch-powered website is set up on your server(s), your template library will be downloaded and installed automatically.<br />
<br />
==Rename/Delete a page that won't delete==<br />
Usually, if you can't delete a page it's because it has some trouble characters in its name like an ampersand (&) or something. In order to delete the page you'll have to rename it first. And you'll have to rename it "the hard way" because that ampersand won't let you rename it "the easy way" (via Page Properties) for the same reason it won't let you delete the page.<br />
<br />
So here's the step by step for manually renaming a page called "Milo & Otis" to "Milo and Otis" so it won't give you any more problems.<br />
#Go to Main Menu > Database Table Manager<br />
#Select the site_pages table from the drop-down menu<br />
#Hit the "Enter/Edit Record Data" button<br />
#When the table pulls up click the link on the top right that says "Run custom query"<br />
#Put the following tn the text box that pops-up and hit the "Run Query" button...<br />
update site_pages set page_name = 'Milo and Otis' where page_name = 'Milo & Otis'<br />
<br />
Once you follow these steps you should be able to delete, rename, etc the page as normal.<br />
<br />
==Find/Edit custom table search includes==<br />
Via FTP, the files are located here...<br />
[public_html]/media<br />
<br />
File naming convention...<br />
udt-search_[search name].inc<br />
<br />
Example file name...<br />
udt-search_joes_cool_search.inc<br />
<br />
You can download these files to your PC, modify them, then upload them back to that /media folder and you're good to go.<br />
<br />
==Link to specific shopping cart sku==<br />
Go to your website and browse your shopping cart. Click the Buy Now/More Information link for the product you want to link to, then copy the url from your address bar. Should look something like this...<br />
<br />
http://provx.soholaunch.com/shopping/pgm-more_information.php?id=1<br />
<br />
Advanced Note: That id # matches the prikey value of that sku in the cart_products table.<br />
<br />
==Link to specific shopping cart category==<br />
Go to your website and browse your shopping cart. In the search column you'll see a list of links to your categories (in the search column). Click on the link to the category you want, then copy the url from your address bar. Should look something like this...<br />
<br />
http://yourdomain.com/shopping/start.php?browse=1&cat=25<br />
<br />
==Link to specific month/year in you event calendar==<br />
In the text editor, select the text you want to link and hit the little link icon/button next to the paint bucket. Then in the link dialog that pops up, in the field that says "(or) Link / Anchor:" and has "http://" already in the field, do this...<br />
<br />
http://yourdomain.com/About_Us.php?SEL_MONTH=04&SEL_YEAR=2007<br />
<br />
Note: Replace "About_Us" with the name of the page that you dropped you're calendar on, and replace the month and year numbers with whatever month/year you want to jump to.<br />
<br />
==Reset your hit counter==<br />
#Log-in to your site via FTP<br />
#Browse to the "sohoadmin/filebin/" folder<br />
#Delete hitcounter.txt<br />
<br />
==Move license from subdomain to primary domain==<br />
#Log-in to the partner area<br />
#Click on "Lifetime Licenses"<br />
#Delete the license listed for your subdomain<br />
#Click "Add Domain"<br />
#Fill-in the name of your primary domain and click "Generate License"<br />
<br />
==Download page content files==<br />
Via FTP, the files are located here...<br />
[public_html]/sohoadmin/tmp_content<br />
<br />
===What's the difference between CON and REGEN files?===<br />
In short, CON files are for the website-side, REGEN files are for the admin-side. <br />
<br />
;CON files: When a visitor views a page on your website, script files read the CON file for that page and use it to build the final HTML for the page. CON files tell the website-side scripts that you've got a cart item, a login box, and this text on this page.<br />
<br />
;REGEN files: These are used by Soholaunch's Page Editor. When you open a page in Soholaunch to edit it, the REGEN file for that page is read and it tells the product what objects are on the page and which dropzones to display them in.<br />
<br />
When you save a page in the Page Editor, it saves a REGEN file for that page so it knows what edit options to show you in the Page Editor the next time you edit that page, and then it builds a CON file for the page so that the website-side scripts know what to display to site visitors.<br />
<br />
==Upload video files via FTP==<br />
Via FTP, the files are located here...<br />
[public_html]/media<br />
<br />
==Find/Edit the default contact forms==<br />
'''Contact forms'''<br><br />
Via FTP, the files are located here...<br />
[public_html]/sohoadmin/program/modules/page_editor/formlib/forms<br />
<br />
The files are:<br />
*Contact_Form_(Basic).form<br />
*General_Email_Form.form<br />
<br />
'''Newsletter quick signup form'''<br><br />
The file for this is located here...<br />
[public_html]/sohoadmin/program/modules/page_editor/formlib/newsletter/Quick-N-Easy_Signup.form<br />
<br />
'''Points to remember:'''<br />
*Though they're technicaly just html files, make sure to preserve the .form extension when you upload them back to your site so the system can recognize them (which is the whole idea behind the .form extension --- so know it's a form).<br />
<br />
==Find your template folder==<br />
'''1. Log-in via FTP to your website and navigate to this folder...'''<br />
public_html/sohoadmin/program/modules/site_templates/pages/<br />
<br />
'''2. Find the folder for your specific template.'''<br />
This is the naming convention for template folders..<br />
CATEGORY-Template_Name-Color<br />
<br />
So if you're using CORPORATE > A_Curvacious_Mark (Blue), your template folder would be...<br />
CORPORATE-A_Curvacious_Mark-Blue<br />
<br />
...and the full path from your home directory would be:<br />
public_html/sohoadmin/program/modules/site_templates/pages/CORPORATE-A_Curvacious_Mark-Blue<br />
<br />
==Swap out your template header text for a logo image==<br />
1. Download the '''index.html''' file from your [[#Find your template folder|template folder]]<br />
<br />
2. Find (ctrl+f) '''"#LOGO#"'''<br />
<br />
3. Replace it with '''"#LOGOIMG#"'''<br />
<br />
4. Save the file and upload it back to your template folder<br />
<br />
You can now add and change the logo image in your template via Template Manager (where it says choose logo image). <br />
<br />
The same logic applies if you want to change your logo text to something else or add other information right around it. For example, if your template allows for header text via #LOGO# and you want slogan text too, you could find that #LOGO# in your template's .html file but instead of replacing it with #LOGOIMG# you could change it to something like...<br />
<br />
'''Example: Apply same logic to add slogan text'''<br />
<br />
''Original line in template's index.html file...''<br />
#LOGO#<br />
<br />
''Add a line break and the pound-variable for slogan text...''<br />
#LOGO#<br>#SLOGAN#<br />
<br />
Complete list of available pound variables like #LOGO#, #LOGOIMG#, and #SLOGAN#, see [[Custom_Template_Reference|custom template reference]].<br />
<br />
==Set background image==<br />
1. '''Log-in via FTP and find your template's folder...'''<br />
<br />
2. '''Upload the image you want to use''' as your background to that folder<br />
<br />
3. '''Download the custom.css file''' that's in there and open it up in your code editor of choice (or notepad will work if nothing else)<br />
<br />
4. '''Add in this code...'''<br />
body { background-image: url(mybackgroundimage.gif); }<br />
<br />
5. '''Save the file (custom.css)''' and upload it back to your template's folder<br />
<br />
==Make a button that links to another website, but opens that link in a new window==<br />
<br />
'''Solution:''' Pull up the Text Editor where you put in the button, click on the "HTML" button at the bottom left. <br />
<br />
The HTML for your button should look something like this...<br />
<pre><input type="button" style="width: 163px; color: <br />
rgb(29, 0, 237); height: 24px; background-color: rgb(249, 186, 0);"<br />
size="217" value="Click here to go to example.com"></pre><br />
<br />
To make this button link to "www.example.com", insert the following "onclick" attribute...<br />
<pre>onclick="window.open('http://www.example.com','', <br />
'width=800px,height=600px,resizable');"</pre><br />
<br />
So the full code for the button should look something like...<br />
<pre><input type="button" onclick="window.open('http://www.example.com','',<br />
'width=800px, height=600px,resizable');"<br />
style="width: 163px; color: rgb(29, 0, 237); <br />
height: 24px; background-color: rgb(249, 186, 0);" <br />
size="217" value="My Button"></pre><br />
<br />
Just replace "www.example.com" with the site you want to link to, and you're good to go.<br />
<br />
==Install Soholaunch on a subdomain manually via cPanel==<br />
How to install manually on subdomain....<br />
<br />
http://soholaunch.com<br />
# Download installer<br />
<br />
cPanel<br />
# Create database<br />
# Create user<br />
# Add user to database<br />
<br />
Local PC<br />
# Extract installsoholaunch.zip somewhere<br />
<br />
FTP Client<br />
# Upload installsoholaunch.php to root of subfolder for subdomain (e.g., "public_html/fr" for "fr.domain.com")<br />
<br />
Browser<br />
# Go to yourdomain.com/installsoholaunch.php<br />
# Click install button<br />
# Fill-out setup form with database info (db name, username, password you just created in cPanel)<br />
# Done installing!<br />
<br />
==Import a large number of shopping cart items at once==<br />
# Log-in to sohoadmin (yourdomain.com/sohoadmin)<br />
# Main Menu > Database Tables > System Tables tab<br />
# Scroll until you see the "cart_products" table. If it does not exist, return to the Main Menu and click the Shopping Cart icon once, wait for the Shopping Cart menu to load (the one with buttons that say things like Shipping Options, Find/Edit Products, Tax Options, etc), and then go back to Database Tables > System Tables (so basically start over at step #2 above).<br />
# Next to the "cart_products" name you'll see a Download link. Click that to download the table in CSV format.<br />
# Open Microsoft Excel, create a new spreadsheet<br />
# In Excel, do this: Data > Import External Data > (select the file you downloaded) > Semicolon delimited > Finish<br />
# Now you have all the right column names set up in your spreadsheet, you can start filling it out with all your product info.<br />
# When you've got it filled out, Save As > CSV file (semicolon delimited) > Yes on the warning prompt about losing funcitonality<br />
# Back in sohoadmin, go to Main Menu > File Manager > Upload Files<br />
# Upload the .csv file you just saved your spreadsheet to.<br />
# Go back to sohoadmin > Main Menu > Database Tables > System tables tab<br />
# Next to cart_products, click the Import link. <br />
# Select the CSV file you uploaded, then follow the prompts to make sure that your column names match up.<br />
# Once you finish the Import action, you're all done!<br />
<br />
'''Note1:''' If you already have a spreadsheet full of shopping cart items, skip to step 8<br />
<br />
'''Note2:''' The PROD_CATEGORY fields use the keyfield numbers from the cart_category table, which you can also view via Database Tables > System Tables tab > View/Edit Records<br />
<br />
'''Note3:''' You can also use this import feature to ''update'' many cart items at one time.<br />
<br />
'''Note4:''' Always use the Backup/Restore to make a backup first!<br />
<br />
==Transfer shopping cart items from one site to another==<br />
<br />
sohoadmin for Main site (e.g, yourdomain.com)<br />
# Database Tables feature<br />
# System Tables<br />
# cart_products<br />
# Click the download link<br />
# Save that somewhere on your PC<br />
<br />
sohoadmin for subdomain (e.g., fr.yourdomain.com)<br />
# File Manager<br />
# Upload Files<br />
# Upload csv file that you downloaded<br />
# Database Tables<br />
# System Tables<br />
# cart_products<br />
# Import<br />
# Follow instructions<br />
<br />
==Make blog sort by earliest-to-latest, instead of latest-to-earliest.==<br />
1. Log-in via FTP, browse to your public_html folder<br />
<br />
2. Download pgm-blog_display.php<br />
<br />
3. Modify sort order by finding this line...<br />
$blog_qry = "ORDER BY timestamp DESC, PRIKEY DESC LIMIT 15"; // Limit by 15<br />
<br />
to this...<br />
$blog_qry = "ORDER BY timestamp DESC, PRIKEY ASC LIMIT 15"; // Limit by 15<br />
<br />
4. To be safe, find all other instances of "DESC" and replace them with "ASC".<br />
<br />
5. Save. Upload your modified pgm-blog_display.php TO YOUR TEMPLATE FOLDER. If Soholaunch finds a pgm-blog_display.php in your template folder, it will use it instead of the standard file.<br />
<br />
==Enable pre-release testing builds==<br />
Sometimes we will release small version updates to address specific problems on client websites (or to test new features). You can think of these builds as "nightly" or "beta" builds. They come with no guarantees about reliability, and you should not update to them unless you are installing on a development site, or unless a member of the Soholaunch support staff tells you to update to it.<br />
<br />
By default, you cannot see these beta builds in the Software Updates feature. You need to enable them. Here's how to do that...<br />
# From your sohoadmin control panel, go here: Main Menu > Webmaster > Software Updates<br />
# Click the link that looks like this: "[?] Technical diagnostic info (for geeks)"<br />
# This will open a popup layer. Look at the bottom of the popup.<br />
# Set this option to "Yes/Enabled": "Enable pre-release testing builds"<br />
# Close popup and click the Check For Updates button again<br />
# You should see the beta build listed as available to install (note a beta build is not always available).<br />
<br />
==Create a database with cPanel==<br />
All Soholaunch installations require a database, along with an associated database user/pass. Here's how to create a MySQL database and assign a user to it using cPanel.<br />
<br />
===Step 1: Create the Database===<br />
# Log-in to cPanel (yourdomain.com/cpanel)<br />
# Find the icon for MySQL Databases. Click it.<br />
# Under the Create New Database heading, fill in a name in the text field (note that usually every database is prefixed with your cPanel username, which is shown before the text field). Usually, I just type in "soho" for the database name, making the full database name "[username]_soho"<br />
# Click the Create New Database button.<br />
# Now your database is created.<br />
<br />
===Step 2: Create a User===<br />
Now you need to create a user/pass for the database.<br />
# Still on the MySQL Databases page, scroll down under Add New User.<br />
# Fill in a name. This is like the database name. You're only going to use it once and you won't need to remember it for more than the next 5 minutes. Keep it short and use letters only.<br />
# Note: Like the database name, the username is prefixed is by your cPanel username.<br />
# For the password, just use the password generator and copy it down somewhere temporary. Again, you will only need this password for the next 5 minutes of your life.<br />
# Click the Create User button.<br />
<br />
===Assign the user to the database===<br />
*Why this is necessary:* In case you're curious as to why we have to do this: All you've done so far is create a user for the database. Right now, this user has no authority. He's just an empty shell of a user, lonely and without a database to work on. You need to associate this new user with the database.<br />
<br />
# Scroll down to the Add User to Database section (underneath where you created the user).<br />
# Select the name of the user you just created from the first dropdown.<br />
# Select the name of the database you created in Step 1 from the second dropdown.<br />
# Click the Add button<br />
# Check the box for All Privileges<br />
# Click the Add button<br />
# All done!</div>Sohohttps://wiki.soholaunch.com/index.php?title=How_toHow to2013-12-16T18:31:44Z<p>Soho: /* Use an Authorize.net Gateway */</p>
<hr />
<div>==Use an Authorize.net reseller for your payment gateway==<br />
Many payment gateways are resellers of the popular Authorize.net payment gateway. They may offer better rates and packages, but ultimately they're selling the same technology, except that they use a different URL address for accepting payments. Both Soholaunch Pro and Soholaunch Ultra include a simple, built-in way to change the gateway URL on soho's built-in Authorize.net integration so that you can use Authorize.net reseller gateways.<br />
<br />
===How to change the Authorize===<br />
The Authorize.net gateway URL is composed of two parts...<br />
# The hostname: secure.authorize.net<br />
# The path: /gateway/transact.dll<br />
<br />
These are the two variables that you need to adjust to use your reseller gateway. You can add custom URL and path to the Soholaunch smt_userdata table using special variable names, and Soholaunch will use your custom host and path instead.<br />
<br />
# Go to the Database Tables feature<br />
# Click the System Tables tab.<br />
# Find the smt_userdata table<br />
# Click View/Edit Records<br />
# Add New Record<br />
# prikey (leave blank), plugin = 'cart_authorize', fieldname = 'scHost', data = '[your custom url]' (all those values should be typed WITHOUT the single quotes)<br />
# Save New Record<br />
# Add New Record<br />
# prikey (leave blank), plugin = 'cart_authorize', fieldname = 'scPath', data = '[your custom path]'<br />
# Save New Record<br />
# All done!<br />
<br />
==Add an XML Sitemap to your website==<br />
'''Part one: Generate a sitemap'''<br />
# Visit [http://xml-sitemaps.com xml-sitemaps.com]<br />
# Follow-the instructions to generate an XML sitemap for your site.<br />
# Copy the sitemap it generates (Ctrl+c)<br />
# Open MS Notepad (or Typepad on a Mac)<br />
# Paste in your sitemap (Ctrl+v)<br />
# Save the file as sitemap.xml<br />
<br />
'''Part two: Upload sitemap'''<br />
# Log-in to your sohoadmin<br />
# From the Main Menu, press the F4 key to launch the secret super-tool.<br />
# This screen may look scary, but it will help you upload the sitemap to your home folder.<br />
# Make sure the path at the top shows that you are in the public_html folder<br />
# Click the upload button to select the sitemap.xml file from your computer and upload it<br />
# All done!<br />
<br />
==Verify your site with Google Webmaster Tools==<br />
'''Part one: Add site to your Google account'''<br />
# Log-in to your Google Account<br />
# Go to Google Webmaster Tools<br />
# Click Add a Site<br />
# Click Manage site > Verify this site<br />
# Click the link to Download the HTML verification file<br />
# Save that file to your computer somewhere<br />
<br />
'''Part two: Upload verification file'''<br />
# Log-in to your sohoadmin<br />
# From the Main Menu, press the F4 key to launch the secret super-tool.<br />
# This screen may look scary, but it will help you upload Google's file to your home folder.<br />
# Make sure the path at the top shows that you are in the public_html folder<br />
# Click the upload button to select the Google file from your computer and upload it<br />
<br />
'''Part three: Finalize verification'''<br />
# Go back to Google Webmaster Tools<br />
# Click Verify<br />
# Done!<br />
<br />
==Put a text link on top of an image==<br />
There are a couple ways to put a link on top of an image. Here are two methods.<br />
<br />
===1. Overlay a normal text link on an image.===<br />
The idea here is to set your image as a background image for an element that contains your text link. <br />
<br />
So let's say you have an image called...<br />
kitten.jpg (300px width X 150px height)<br />
<br />
...and you want to lay a text link on it. What you're going to do is create a container element in html that has the same width and height as your image, assign your image to be the background image, and then put your text inside the container element. <br />
<br />
Flip over to the Text Editor's HTML view (you should also do this as a custom code file) and put in some html like below. You can copy-paste this if you'd like.<br />
<pre><br />
<div style="width: 300px;height: 150px;background-image: url('images/kitten.jpg');"><br />
<a href="http://example.com/Kittens.php">Click here to see kittens</a><br />
</div><br />
</pre><br />
<br />
===2. Create an image map===<br />
An image map is a combination of image and code that basically makes certain sections of the image clickable like links. You typically define the sections through a graphical image map maker. There are lots of free standalone products, and image mapping is a built in tool for most major web development software packages (e.g., Adobe Dreamweaver). <br />
<br />
Note that once you use such a program to create an image map, it will give you a bunch of code to insert on your page. Use Soholaunch's "Custom Code" drag-and-drop object to put that on your page.<br />
<br />
===3. Use absolute positioning with CSS===<br />
This is the "advanced" method. If you don't already know what this is, it will take more than a paragraph to explain it well. Going in-depth into CSS positioning would be a little out-of-scope for this page, and lots of people on the web have already done a great job explaining it. But if you're interested and you're the tinkering type, search around for [http://lmgtfy.com/?q=css+positioning+tutorial tutorials on CSS positioning]. You may want to do a few CSS primers first if you've never looked at it before.<br />
<br />
==Install Google Analytics code on your website==<br />
Google Analytics is an ultra-powerful stats package provided by Google for analyzing your website traffic. It will give you a dazzling amount of information about your site visitors.<br />
<br />
To use Google Analytics with your website, you must add Google's special tracking code to all of your site pages. Because Soholaunch uses templates (one master file that controls the style for your whole website), you don't have to worry about adding it to all your pages. You can just add it in one place and be done with it.<br />
<br />
There are two easy ways to add Google's code to your Soholaunch-powered website:<br />
<br />
===1. The Easy Way: Grab a plugin===<br />
Go try one of the [http://addons.soholaunch.com/?pr=Plugins&search_qry=analytics several Google Analytics plugins] available at [http://addons.soholaunch.com Soholaunch Addons]: <br />
<br />
===2. The Hard Way: Edit your template file===<br />
# [http://wiki.soholaunch.com/index.php?title=How_to#Find_your_template_folder First, find your template folder] through [http://wiki.soholaunch.com/index.php?title=How_to#Get_started_with_FTP FTP]<br />
# Locate the index.html file within your template folder<br />
# Follow Google's instructions for adding the code.<br />
# Also note that if your template folder contains a home.html file, you will need to add the Google Code there as well.<br />
<br />
==Export shopping cart products==<br />
Using the Database Tables feature it is possible to export your shopping cart products into a semicolon-delimited .csv file that you can then import into spreadsheets (e.g., Microsoft Excel) and many other systems. <br />
<br />
Here are instructions for exporting your shopping cart products:<br />
# Log-in to sohoadmin<br />
# From the Main Menu, click the Database Tables icon.<br />
# Click the System Tables tab<br />
# Find the "cart_products" table.<br />
# Click the "Download" link.<br />
# Save the file to your local computer<br />
<br />
==Prevent PayPal Order Number Conflicts==<br />
If you are using one paypal account to accept orders on more than one Soholaunch website, you may run into order number conflicts. This usually manifests in an error from PayPal that says something like "Order already exists". <br />
<br />
===The problem===<br />
The Soholaunch Shopping Cart starts it's order numbers off at 10000 and counts up one at a time per order, so your third order will be order #10003. When you use PayPal as your payment gateway, this order number is passed to paypal as the unique identifier number for PayPal.<br />
<br />
Normally, when you just have one website, this is all fine and dandy. But when you have two websites running through the same PayPal account, you start to get conflicts. If you've received three orders from Site A and three orders from Site B, the third order on both sites is going to pass to PayPal as #10003. When the Site B tries to run its third order through, PayPal says "Hey, no...that order number already exists" (because Site A used it earlier).<br />
<br />
===How to fix it===<br />
The fix for the duplicate order number problem is simple enough. You just need to jump the order numbers on one of your site to another range, so that the two order number ranges don't ever overlap.<br />
<br />
You can leave Site A alone in it's 10000 range. For Site B, do this...<br />
# Main Menu<br />
# Database Tables<br />
# System Tables tab<br />
# cart_invoices<br />
# View/Edit Records<br />
# Add New Record<br />
# Specify a really high number like 200000 for the ORDER_NUMBER<br />
# Leave all the other fields blank<br />
# Save<br />
# View table and delete your test record (if you want)<br />
# From now on order numbers will start at whatever number you put in (e.g., 200000)<br />
<br />
==Use special characters in your navigation menu links==<br />
<br />
Soholaunch does not currently support using special characters (anything besides letters, numbers, and spaces) in your site's menu navigation, neither in main page links nor in sub page links.<br />
<br />
Although we are working to improve this in future versions so that you can use whatever characters you want, there are ways to get around the current restriction in the mean time.<br />
<br />
===Method #1: Search and Replace Table===<br />
Let's assume you want to create a page called Lilo & Stitch. Normally, that ampersand will make the Soholaunch paging system <br />
<br />
# Name your page something that works under the standard page naming restrictions, so let's say "Lilo and Stitch".<br />
# Go Main Menu > Database Tables > User Tables > UDT_CONTENT_SEARCH_REPLACE > View/Edit Records<br />
# Add a Record<br />
# Search for: "Lilo and Stitch" (without the quotes)<br />
# Replace with: "Lilo & Stitch" (without the quotes)<br />
<br />
===Method #2: Hard code your menu===<br />
If you are comfortable modifying the html file for your template, you can certainly hard-code your menu navigation directly into the HTML file and use whatever special characters you want.<br />
<br />
==Copy-Paste Content from Microsoft Word==<br />
Pasting from MS Word is always a problem for WYSIWYG editors like the Soholaunch Text Editor, because the content that you copy from Word carries all of this crappy Microsoft psuedo-html code with it. Some of that code works; some of it can't be interpreted by the browser. Hence the funky, half-working result you end up with a lot of times.<br />
<br />
To combat this, we recommend two options:<br />
<br />
1. Instead of normal pasting (Ctrl+V or right-click, paste), use the Paste from Word button inside the Soholaunch Text Editor. Note that this button does not work in FireFox (not for lack of trying). When you hit that button, the soho editor will try to translate the odd MS Word code into to real html code, which will usually yield a bit better results than just normal pasting.<br />
<br />
2. Strip all the formatting before you paste. As in, copy the content from MS Word, paste it in a bare-bones text editor like MS Notepad, then copy from there in to the soho editor and format as you like. This is certainly the most reliable, quirk-free method, though it does require you to re-do your formatting.<br />
<br />
==How to find your FTP login==<br />
If you submit support tickets with us, we will usually ask you for your "FTP" login username and password. If your web hosting company offers "cPanel", then this username/password is probably the same as your "cPanel" user name and password. You usually find this log-in information in the "Welcome" email that your web hosting company sent you when you first signed up with them.<br />
<br />
==How to fix a corrupt page==<br />
Sometimes certain content on a page will break the page editor. Often you don't know this is happening until it's too late and your page is corrupted. <br />
<br />
Symptoms of a corrupt page:<br />
* Page Editor: Fails to load<br />
* Page Editor: Cannot delete objects<br />
* Page Editor: Not all grid squares display<br />
* Page does not display correctly (or at all)<br />
<br />
Cause of corrupt page: Code or script that you have copy-pasted from elsewhere is messing with the page editor.<br />
<br />
If this happens to you the best thing to do is create a new page, then re-place your content from the broken page one element at a time. Of special note: To be extra safe, put all suspicious content on the page using the Custom Code object (which prevents the Page Editor from trying to interpret it).<br />
<br />
Note: Again, the cause of corrupt pages is almost always broken html code that you have copy-pasted, or javascript that you have copy-pasted into the Text Editor. If you need to put javascript or other special code on the page, do it with the Custom Code object.<br />
<br />
Note2: You may have to completely delete the original page and start over.<br />
<br />
Related: [http://wiki.soholaunch.com/index.php?title=How_to#Put_some_HTML_on_a_page_as_a_custom_code How to place something on a page as custom code]<br />
<br />
==How to add anchor links==<br />
Here is how you install anchors to text in Soholaunch:<br />
<br />
# In the text editor, place your cursor at the place where you would like the anchor. Click the anchor button and create a short, single word name for the anchor. Click Insert.<br />
# Now go to the text you would like linked to that anchor and select (highlight) the text.<br />
# Click the insert/edit link button. in the Anchors dropdown select the correct anchor for the text and click insert.<br />
<br />
That should help you. Keep in mind that you create the anchor first and then link text to the anchor. Also, anchors are only valid within the same text editor. If you have multiple text boxes on a page the anchors will not work between separate text boxes.<br />
<br />
==Update to the latest version==<br />
From the Main Menu of /sohoadmin...<br />
# Click the Webmaster buttton on the top nav<br />
# Click the Software Updates button<br />
# Click the big "Check for Updates Now" button<br />
# Select the build you want to install<br />
# Click "Install"<br />
<br />
==Download new language translation files==<br />
Translations of the Soholaunch product are now handled at http://translate.soholuaunch.com. If you speak multiple languages and want to help translate Soholaunch, you can go to that site, sign up for a free account, and start translating immediately.<br />
<br />
At any time you can download the latest language file for a given language. Here's how...<br />
# Go to http://translate.soholaunch.com<br />
# Sign-up/Log-in<br />
# Set language to the language you want to download (e.g., Hebrew)<br />
# Click link at top-left to download latest translation files<br />
<br />
Once you have downloaded the latest language file you can add it to your Soholaunch-powered website by logging-in via FTP, and uploading the hebrew.php (or spanish.php, or whatever.php) file you downloaded to this folder...<br />
public_html/sohoadmin/language<br />
<br />
==Make text scroll like a marquee==<br />
The old Text Editor (< v4.9.3) used to include a "marquee" feature that would allow you to make any block of text scroll across the page. It was absent in the updated version of the Text Editor (v4.9.3) --- and was left out because it was buggy and was more trouble than it seemed worth.<br />
<br />
However, you can still make text scroll like that by switching to HTML View and putting <marquee> tags around the part you want to scroll, like this...<br />
<br />
<marquee>scroll me</marquee><br />
<br />
[http://www.quackit.com/html/codes/html_marquee_code.cfm Check out this website I found for more on the marquee tag and how you can configure it (e.g., speed, etc).]<br />
<br />
==Put some HTML on a page as a custom code==<br />
Sometimes you try to paste some code in the Soholaunch Text Editor and you can't get it to work right. This typically happens with code that people copy-paste from other providers (like PayPal button code). In most of these cases the Text Editor in soho is trying to interpret the code so you can see what it's output looks like, but if there's javascript in there or something it can through the editor off (because it tries to execute the javascript when it gets to it...with all kinds of quirky results).<br />
<br />
Anyhow, you can avoid all these problems by putting your special code in a custom include and dropping it on your page via the Custom Code object. Any code dropped on the page via the Custom Code object is not interpreted until the page itself is loaded by the site visitor.<br />
<br />
This fixes 99.9% of all "I put the code in the Text Editor but it doesn't work." problems.<br />
<br />
# Go to edit the page where you would like to place the custom HTML.<br />
# Drag & Drop the Custom code item onto the page from the menu.<br />
# Select New file and enter a name for the embed.<br />
# Click Create New File.<br />
# Paste in the HTML.<br />
# Click Save.<br />
# Select the file from the dropdown.<br />
# Click OK.<br />
# Save page<br />
<br />
===Alternate method, create your own #variables# for your custom code===<br />
Sometimes you need custom code to display nested within content that you create using the Text Editor. For example, let's say you have a table with two columns and you want to put normal text in one column and Google ads in the other column.<br />
<br />
For this scenario, using the above method (the Custom Code drag-and-drop object) is less than ideal because you can't get precise placement using the Custom Code method (unless you include the whole table in your custom code, but that's for people who know HTML).<br />
<br />
So with this alternate method, instead of placing the custom html directly on the page, you're going to place a custom placeholder variable where you want the custom code to appear, and then use the [http://wiki.soholaunch.com/index.php?title=UDT_CONTENT_SEARCH_REPLACE UDT_CONTENT_SEARCH_REPLACE] table to replace that placeholder with the actual code when the page loads for the site visitor.<br />
<br />
Here are the steps to follow...<br />
# In the Text Editor place something the text "#mycodewillgohere#" (without the quotes) where you want the custom code to show up. This is going to be your placeholder variable. You can use whatever text you want. For example, it could be #emilyscoolvariable#...it doesn't matter, as long as it's not one of the [http://wiki.soholaunch.com/index.php?title=Custom_Template_Reference#Pound_Variables reserved variables].<br />
# Press the Update button in the Text Editor to apply your changes<br />
# Press the Save Page button.<br />
# Go to the Main Menu<br />
# Click Database Tables<br />
# Under User Tables, View/Edit Records in the UDT_CONTENT_SEARCH_REPLACE table.<br />
# Press the Add New Record button<br />
# For the "Search For" field, enter your placeholder variable (e.g., #mycodewillgohere# or #emilyscoolvariable#)<br />
# For the "Replace With" field, paste in your custom code.<br />
# Save Record.<br />
# View website. Your code should work when the is viewed, but remain as a #variable# while you're editing the page.<br />
<br />
The bonus of this method is that you can now use that #mycodewillgohere# variable ANYWHERE on your website, as many times as you want (instead of having to frequently copy-paste your custom code everywhere, you can just type that variable name).<br />
<br />
==Get started with FTP==<br />
FTP (File Transfer Protocol) is like Windows Explorer for your website's files. Often, especially when you start tinkering with your template html and css, you'll need a way to access files that the Soholaunch tool itself doesn't provide you direct access to....a way to get behind the curtain a little. This is what FTP is for.<br />
<br />
One of the better FTP clients out there is also free. It's called FileZilla. You can download it here...<br />
http://filezilla-project.org/<br />
<br />
In order to get at your template folder...<br />
# Go download filezilla (http://filezilla-project.org/)<br />
# Install it on your computer<br />
# At the top you'll see fields for host, username, and password. For "host" just fill-in your domain name (e.g., example.com). You username and password are typically the same as your cpanel usename and password. If you can't get the right username/password, check the welcome email from your web hosting company. If you can't find that, contact your web hosting company and ask them for you ftp username/password <br />
# Once you're in through ftp, [http://wiki.soholaunch.com/index.php?title=How_to#Find_your_template_folder locate your template folder]<br />
# The two files you are probably looking for are index.html and custom.css. See: [http://wiki.soholaunch.com/index.php?title=Custom_Template_Reference#Template_folder_and_files Template Folder and Files]<br />
# Download the file you want to modify to your PC, make your changes, then upload it back to your site...all though this FileZilla FTP program.<br />
<br />
==Modify your custom.css file==<br />
Most templates --- including all factory templates and most templates available on the [[http://addons.soholaunch.com|Soholaunch Addons]] website --- make use of a file called custom.css. This file contains all (or mostly all) of the styles that affect how your template looks and feels.<br />
<br />
If you want to make color, style, etc changes to your template, chances are what you are looking for is located in your template's custom.css file.<br />
<br />
You can find this file in your template folder.<br />
<br />
==Move your site to a different server==<br />
# Sign-up for new hosting account<br />
# Get temporary access url from your new web hosting company<br />
# Use temporary url to install Soholaunch to new hosting space (via Fantastico or our installsoholaunch.php script)<br />
# Back on your OLD server, log-in to sohoadmin. <br />
# Go to the Webmaster menu.<br />
# Click the Site Mover tool<br />
# Click Move this Site<br />
# Download that file it creates<br />
# On your NEW server, log-in to sohoadmin.<br />
# Go to Webmaster Menu.<br />
# Click Site Mover tool<br />
# Upload your transfer file<br />
# At your domain registrar, re-point your domain name<br />
<br />
==Add a custom redirect to a page==<br />
Here is the code to do a proper (search engine-friendly) redirect. Put this php code in a file, call it "whatever.php", and drop it on the page you want to redirect via the Custom Code object in the Page Editor.<br />
<br />
Make sure to change that "redirectohere.example.com" address.<br />
<br />
<?php<br />
header("HTTP/1.1 301 Moved Permanently");<br />
header("location: http://redirectohere.example.com");<br />
exit;<br />
?><br />
<br />
==Maximize the admin/editing window in Internet Explorer==<br />
The sohoadmin window is designed to run in a fixed size of a little smaller than 800x600 dimensions to make sure it fits on all monitor resolutions.<br />
<br />
However, sometimes it can be handy to be able to make the admin window larger if you have enough screen real-estate to do so. If you are using a browser besides Internet Explorer, like Mozilla FireFox (our recommended browser), then you can simply drag the bottom-right corner of your browser window to resize it. <br />
<br />
But if you're using Internet Explorer then follow these steps...<br />
<br />
1. Log-in to sohoadmin<br />
<br />
2. Close the sohoadmin window after it launches<br />
<br />
3. You should be looking at the "Click here to re-launch admin window" screen.<br />
<br />
4. In the address bar you'll see a URL like this...<br />
http://example.com/sohoadmin/index.php<br />
<br />
5. Change it to this...<br />
http://example.com/sohoadmin/version.php<br />
<br />
6. Hit the Enter key<br />
<br />
7. Admin window will re-launch and be resizeable<br />
<br />
==Add fonts to the new Text Editor==<br />
===CIA Fonts will not work with v4.9.2+===<br />
In versions prior to v4.9.2 there was a plugin called CIA Fonts on the Soholaunch Addons website that made it easy to add fonts to the Text Editor. But as of v4.9.2 this plugin will no longer work (until it is updated...hint, hint Thomas), because v4.9.2+ builds incorporate a completely different text editor. <br />
<br />
===The new workaround method for sites running v4.9.2+===<br />
Until an easier solution is created (which should happen before too long), you can still add fonts to the new editor, but not quite as easily as you could with the old editor and CIA Fonts. <br />
<br />
Here's how to add fonts to the new Text Editor<br />
<br />
;Note: You '''must be running''' at least '''v4.9.2 r7+''' to add fonts using this method...'''<br />
#Go to Database Table Manager<br />
#Click the "System tables" tab<br />
#Find the '''smt_userdata''' table<br />
#Click View/Edit Records<br />
#Using the search box at the top left run a search on "customfonts" (without the qoutes). Only one record should be returned.<br />
#Edit that record<br />
#Add fonts to that "data" field (details below) and hit the Save Changed Data button<br />
<br />
====Format of fonts list====<br />
The "data" field contains a list of all the fonts available in the Text Editor. You may want to copy-paste the content of the data field into a text/code editor like Dreamweaver or MS Notepad so you can see them all on one line instead of wrapped into multiple lines. Then when you're done editing the list just copy-paste it back into the text field you took it out of and save the record.<br />
<br />
''Example content of "data" field in "customfonts" record...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif<br />
<br />
The font choices are separated by semicolon ";". Each font choice has two parts, separated by an equals sign (=). The first part (e.g., Arial) is the font name as it will display in the Text Editor and doesn't matter (i.e., you could call it "Billyfont". The second part is what actually affects what font will show on the website --- the proper font-family syntax for the html/css code. Some fonts in the second part specify multiple comma-separated fonts --- these are alternates to use if the preceding font isn't available.<br />
<br />
Adding "Trebuchet" to the font list...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;Trebuchet=Trebuchet MS,verdana,arial,sans-serif<br />
<br />
Again, the display name doesn't really matter, and the multiple comma-separated alternative fonts are note required either, so could just have...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;MyFavoriteFont=Trebuchet MS<br />
<br />
When you're done editing the font list in the data field just hit the Save Changed Data to update the record and you're done! Your new font will be available in the Text Editor now.<br />
<br />
==Find out what version of Soholaunch you're running==<br />
[[Image:Howto_find_your_version_no.gif]]<br />
<br />
The installed version number is located in the bottom-right of the admin tool window, in the footer.<br />
<br />
==Create an auto-reply email address field in the Web Form builder==<br />
In the form builder...<br />
<br />
#Click the "(+) Add Field" button<br />
#Click the "Email Address" field<br />
<br />
==Uninstall Soholaunch manually==<br />
Note: This will kill the entire website. Do not do this unless you're positive this is what you want to do. This is meant for people who installed Soholaunch manually (i.e. via installsoholaunch.php) on a website they don't want it on and now want to uninstall it.<br />
<br />
Using your preferred code editor (MS Notepad will work if you don't have a code editor of choice), create a new file (save it as deleteitall.php or something) containing this code....<br />
<pre><br />
<?<br />
shell_exec("rm -rf media");<br />
shell_exec("rm -rf images");<br />
shell_exec("rm -rf import");<br />
shell_exec("rm -rf tCustom");<br />
shell_exec("rm -rf template");<br />
shell_exec("rm -rf shopping");<br />
shell_exec("rm -rf sohoadmin");<br />
echo "Done! It's all gone!";<br />
?><br />
</pre><br />
<br />
...now save that file as something like "deleteitall.php", upload it to your document root folder (i.e. public_html, htdocs, etc.) via FTP and point your browser to websiteyouwantokill.com/deleteitall.php.<br />
<br />
==Offer your customers your own template collection==<br />
To make your custom templates available to every user on your server, wrap them all up in a zip file and upload them somewhere...it can be anywhere, as long as it's accessible from the internet.<br />
<br />
For example, let's say you upload your .zip file full of templates to...<br />
ourmaincompanywebsite.com/soho/our_templates.zip<br />
<br />
Then log-in to the Partner Area and go to "Branding Controls". Under "Templates" check the "My own templates" box, for the "URL path to template library .zip..." field fill-in<br />
http://ourmaincompanywebsite.com/soho/our_templates.zip<br />
<br />
Then scroll down and hit the "Save Options" button. Done! From now on whenever a new Soholaunch-powered website is set up on your server(s), your template library will be downloaded and installed automatically.<br />
<br />
==Rename/Delete a page that won't delete==<br />
Usually, if you can't delete a page it's because it has some trouble characters in its name like an ampersand (&) or something. In order to delete the page you'll have to rename it first. And you'll have to rename it "the hard way" because that ampersand won't let you rename it "the easy way" (via Page Properties) for the same reason it won't let you delete the page.<br />
<br />
So here's the step by step for manually renaming a page called "Milo & Otis" to "Milo and Otis" so it won't give you any more problems.<br />
#Go to Main Menu > Database Table Manager<br />
#Select the site_pages table from the drop-down menu<br />
#Hit the "Enter/Edit Record Data" button<br />
#When the table pulls up click the link on the top right that says "Run custom query"<br />
#Put the following tn the text box that pops-up and hit the "Run Query" button...<br />
update site_pages set page_name = 'Milo and Otis' where page_name = 'Milo & Otis'<br />
<br />
Once you follow these steps you should be able to delete, rename, etc the page as normal.<br />
<br />
==Find/Edit custom table search includes==<br />
Via FTP, the files are located here...<br />
[public_html]/media<br />
<br />
File naming convention...<br />
udt-search_[search name].inc<br />
<br />
Example file name...<br />
udt-search_joes_cool_search.inc<br />
<br />
You can download these files to your PC, modify them, then upload them back to that /media folder and you're good to go.<br />
<br />
==Link to specific shopping cart sku==<br />
Go to your website and browse your shopping cart. Click the Buy Now/More Information link for the product you want to link to, then copy the url from your address bar. Should look something like this...<br />
<br />
http://provx.soholaunch.com/shopping/pgm-more_information.php?id=1<br />
<br />
Advanced Note: That id # matches the prikey value of that sku in the cart_products table.<br />
<br />
==Link to specific shopping cart category==<br />
Go to your website and browse your shopping cart. In the search column you'll see a list of links to your categories (in the search column). Click on the link to the category you want, then copy the url from your address bar. Should look something like this...<br />
<br />
http://yourdomain.com/shopping/start.php?browse=1&cat=25<br />
<br />
==Link to specific month/year in you event calendar==<br />
In the text editor, select the text you want to link and hit the little link icon/button next to the paint bucket. Then in the link dialog that pops up, in the field that says "(or) Link / Anchor:" and has "http://" already in the field, do this...<br />
<br />
http://yourdomain.com/About_Us.php?SEL_MONTH=04&SEL_YEAR=2007<br />
<br />
Note: Replace "About_Us" with the name of the page that you dropped you're calendar on, and replace the month and year numbers with whatever month/year you want to jump to.<br />
<br />
==Reset your hit counter==<br />
#Log-in to your site via FTP<br />
#Browse to the "sohoadmin/filebin/" folder<br />
#Delete hitcounter.txt<br />
<br />
==Move license from subdomain to primary domain==<br />
#Log-in to the partner area<br />
#Click on "Lifetime Licenses"<br />
#Delete the license listed for your subdomain<br />
#Click "Add Domain"<br />
#Fill-in the name of your primary domain and click "Generate License"<br />
<br />
==Download page content files==<br />
Via FTP, the files are located here...<br />
[public_html]/sohoadmin/tmp_content<br />
<br />
===What's the difference between CON and REGEN files?===<br />
In short, CON files are for the website-side, REGEN files are for the admin-side. <br />
<br />
;CON files: When a visitor views a page on your website, script files read the CON file for that page and use it to build the final HTML for the page. CON files tell the website-side scripts that you've got a cart item, a login box, and this text on this page.<br />
<br />
;REGEN files: These are used by Soholaunch's Page Editor. When you open a page in Soholaunch to edit it, the REGEN file for that page is read and it tells the product what objects are on the page and which dropzones to display them in.<br />
<br />
When you save a page in the Page Editor, it saves a REGEN file for that page so it knows what edit options to show you in the Page Editor the next time you edit that page, and then it builds a CON file for the page so that the website-side scripts know what to display to site visitors.<br />
<br />
==Upload video files via FTP==<br />
Via FTP, the files are located here...<br />
[public_html]/media<br />
<br />
==Find/Edit the default contact forms==<br />
'''Contact forms'''<br><br />
Via FTP, the files are located here...<br />
[public_html]/sohoadmin/program/modules/page_editor/formlib/forms<br />
<br />
The files are:<br />
*Contact_Form_(Basic).form<br />
*General_Email_Form.form<br />
<br />
'''Newsletter quick signup form'''<br><br />
The file for this is located here...<br />
[public_html]/sohoadmin/program/modules/page_editor/formlib/newsletter/Quick-N-Easy_Signup.form<br />
<br />
'''Points to remember:'''<br />
*Though they're technicaly just html files, make sure to preserve the .form extension when you upload them back to your site so the system can recognize them (which is the whole idea behind the .form extension --- so know it's a form).<br />
<br />
==Find your template folder==<br />
'''1. Log-in via FTP to your website and navigate to this folder...'''<br />
public_html/sohoadmin/program/modules/site_templates/pages/<br />
<br />
'''2. Find the folder for your specific template.'''<br />
This is the naming convention for template folders..<br />
CATEGORY-Template_Name-Color<br />
<br />
So if you're using CORPORATE > A_Curvacious_Mark (Blue), your template folder would be...<br />
CORPORATE-A_Curvacious_Mark-Blue<br />
<br />
...and the full path from your home directory would be:<br />
public_html/sohoadmin/program/modules/site_templates/pages/CORPORATE-A_Curvacious_Mark-Blue<br />
<br />
==Swap out your template header text for a logo image==<br />
1. Download the '''index.html''' file from your [[#Find your template folder|template folder]]<br />
<br />
2. Find (ctrl+f) '''"#LOGO#"'''<br />
<br />
3. Replace it with '''"#LOGOIMG#"'''<br />
<br />
4. Save the file and upload it back to your template folder<br />
<br />
You can now add and change the logo image in your template via Template Manager (where it says choose logo image). <br />
<br />
The same logic applies if you want to change your logo text to something else or add other information right around it. For example, if your template allows for header text via #LOGO# and you want slogan text too, you could find that #LOGO# in your template's .html file but instead of replacing it with #LOGOIMG# you could change it to something like...<br />
<br />
'''Example: Apply same logic to add slogan text'''<br />
<br />
''Original line in template's index.html file...''<br />
#LOGO#<br />
<br />
''Add a line break and the pound-variable for slogan text...''<br />
#LOGO#<br>#SLOGAN#<br />
<br />
Complete list of available pound variables like #LOGO#, #LOGOIMG#, and #SLOGAN#, see [[Custom_Template_Reference|custom template reference]].<br />
<br />
==Set background image==<br />
1. '''Log-in via FTP and find your template's folder...'''<br />
<br />
2. '''Upload the image you want to use''' as your background to that folder<br />
<br />
3. '''Download the custom.css file''' that's in there and open it up in your code editor of choice (or notepad will work if nothing else)<br />
<br />
4. '''Add in this code...'''<br />
body { background-image: url(mybackgroundimage.gif); }<br />
<br />
5. '''Save the file (custom.css)''' and upload it back to your template's folder<br />
<br />
==Make a button that links to another website, but opens that link in a new window==<br />
<br />
'''Solution:''' Pull up the Text Editor where you put in the button, click on the "HTML" button at the bottom left. <br />
<br />
The HTML for your button should look something like this...<br />
<pre><input type="button" style="width: 163px; color: <br />
rgb(29, 0, 237); height: 24px; background-color: rgb(249, 186, 0);"<br />
size="217" value="Click here to go to example.com"></pre><br />
<br />
To make this button link to "www.example.com", insert the following "onclick" attribute...<br />
<pre>onclick="window.open('http://www.example.com','', <br />
'width=800px,height=600px,resizable');"</pre><br />
<br />
So the full code for the button should look something like...<br />
<pre><input type="button" onclick="window.open('http://www.example.com','',<br />
'width=800px, height=600px,resizable');"<br />
style="width: 163px; color: rgb(29, 0, 237); <br />
height: 24px; background-color: rgb(249, 186, 0);" <br />
size="217" value="My Button"></pre><br />
<br />
Just replace "www.example.com" with the site you want to link to, and you're good to go.<br />
<br />
==Install Soholaunch on a subdomain manually via cPanel==<br />
How to install manually on subdomain....<br />
<br />
http://soholaunch.com<br />
# Download installer<br />
<br />
cPanel<br />
# Create database<br />
# Create user<br />
# Add user to database<br />
<br />
Local PC<br />
# Extract installsoholaunch.zip somewhere<br />
<br />
FTP Client<br />
# Upload installsoholaunch.php to root of subfolder for subdomain (e.g., "public_html/fr" for "fr.domain.com")<br />
<br />
Browser<br />
# Go to yourdomain.com/installsoholaunch.php<br />
# Click install button<br />
# Fill-out setup form with database info (db name, username, password you just created in cPanel)<br />
# Done installing!<br />
<br />
==Import a large number of shopping cart items at once==<br />
# Log-in to sohoadmin (yourdomain.com/sohoadmin)<br />
# Main Menu > Database Tables > System Tables tab<br />
# Scroll until you see the "cart_products" table. If it does not exist, return to the Main Menu and click the Shopping Cart icon once, wait for the Shopping Cart menu to load (the one with buttons that say things like Shipping Options, Find/Edit Products, Tax Options, etc), and then go back to Database Tables > System Tables (so basically start over at step #2 above).<br />
# Next to the "cart_products" name you'll see a Download link. Click that to download the table in CSV format.<br />
# Open Microsoft Excel, create a new spreadsheet<br />
# In Excel, do this: Data > Import External Data > (select the file you downloaded) > Semicolon delimited > Finish<br />
# Now you have all the right column names set up in your spreadsheet, you can start filling it out with all your product info.<br />
# When you've got it filled out, Save As > CSV file (semicolon delimited) > Yes on the warning prompt about losing funcitonality<br />
# Back in sohoadmin, go to Main Menu > File Manager > Upload Files<br />
# Upload the .csv file you just saved your spreadsheet to.<br />
# Go back to sohoadmin > Main Menu > Database Tables > System tables tab<br />
# Next to cart_products, click the Import link. <br />
# Select the CSV file you uploaded, then follow the prompts to make sure that your column names match up.<br />
# Once you finish the Import action, you're all done!<br />
<br />
'''Note1:''' If you already have a spreadsheet full of shopping cart items, skip to step 8<br />
<br />
'''Note2:''' The PROD_CATEGORY fields use the keyfield numbers from the cart_category table, which you can also view via Database Tables > System Tables tab > View/Edit Records<br />
<br />
'''Note3:''' You can also use this import feature to ''update'' many cart items at one time.<br />
<br />
'''Note4:''' Always use the Backup/Restore to make a backup first!<br />
<br />
==Transfer shopping cart items from one site to another==<br />
<br />
sohoadmin for Main site (e.g, yourdomain.com)<br />
# Database Tables feature<br />
# System Tables<br />
# cart_products<br />
# Click the download link<br />
# Save that somewhere on your PC<br />
<br />
sohoadmin for subdomain (e.g., fr.yourdomain.com)<br />
# File Manager<br />
# Upload Files<br />
# Upload csv file that you downloaded<br />
# Database Tables<br />
# System Tables<br />
# cart_products<br />
# Import<br />
# Follow instructions<br />
<br />
==Make blog sort by earliest-to-latest, instead of latest-to-earliest.==<br />
1. Log-in via FTP, browse to your public_html folder<br />
<br />
2. Download pgm-blog_display.php<br />
<br />
3. Modify sort order by finding this line...<br />
$blog_qry = "ORDER BY timestamp DESC, PRIKEY DESC LIMIT 15"; // Limit by 15<br />
<br />
to this...<br />
$blog_qry = "ORDER BY timestamp DESC, PRIKEY ASC LIMIT 15"; // Limit by 15<br />
<br />
4. To be safe, find all other instances of "DESC" and replace them with "ASC".<br />
<br />
5. Save. Upload your modified pgm-blog_display.php TO YOUR TEMPLATE FOLDER. If Soholaunch finds a pgm-blog_display.php in your template folder, it will use it instead of the standard file.<br />
<br />
==Enable pre-release testing builds==<br />
Sometimes we will release small version updates to address specific problems on client websites (or to test new features). You can think of these builds as "nightly" or "beta" builds. They come with no guarantees about reliability, and you should not update to them unless you are installing on a development site, or unless a member of the Soholaunch support staff tells you to update to it.<br />
<br />
By default, you cannot see these beta builds in the Software Updates feature. You need to enable them. Here's how to do that...<br />
# From your sohoadmin control panel, go here: Main Menu > Webmaster > Software Updates<br />
# Click the link that looks like this: "[?] Technical diagnostic info (for geeks)"<br />
# This will open a popup layer. Look at the bottom of the popup.<br />
# Set this option to "Yes/Enabled": "Enable pre-release testing builds"<br />
# Close popup and click the Check For Updates button again<br />
# You should see the beta build listed as available to install (note a beta build is not always available).<br />
<br />
==Create a database with cPanel==<br />
All Soholaunch installations require a database, along with an associated database user/pass. Here's how to create a MySQL database and assign a user to it using cPanel.<br />
<br />
===Step 1: Create the Database===<br />
# Log-in to cPanel (yourdomain.com/cpanel)<br />
# Find the icon for MySQL Databases. Click it.<br />
# Under the Create New Database heading, fill in a name in the text field (note that usually every database is prefixed with your cPanel username, which is shown before the text field). Usually, I just type in "soho" for the database name, making the full database name "[username]_soho"<br />
# Click the Create New Database button.<br />
# Now your database is created.<br />
<br />
===Step 2: Create a User===<br />
Now you need to create a user/pass for the database.<br />
# Still on the MySQL Databases page, scroll down under Add New User.<br />
# Fill in a name. This is like the database name. You're only going to use it once and you won't need to remember it for more than the next 5 minutes. Keep it short and use letters only.<br />
# Note: Like the database name, the username is prefixed is by your cPanel username.<br />
# For the password, just use the password generator and copy it down somewhere temporary. Again, you will only need this password for the next 5 minutes of your life.<br />
# Click the Create User button.<br />
<br />
===Assign the user to the database===<br />
*Why this is necessary:* In case you're curious as to why we have to do this: All you've done so far is create a user for the database. Right now, this user has no authority. He's just an empty shell of a user, lonely and without a database to work on. You need to associate this new user with the database.<br />
<br />
# Scroll down to the Add User to Database section (underneath where you created the user).<br />
# Select the name of the user you just created from the first dropdown.<br />
# Select the name of the database you created in Step 1 from the second dropdown.<br />
# Click the Add button<br />
# Check the box for All Privileges<br />
# Click the Add button<br />
# All done!</div>Sohohttps://wiki.soholaunch.com/index.php?title=How_toHow to2013-12-16T18:31:23Z<p>Soho: /* =How to change the Authorize */</p>
<hr />
<div>==Use an Authorize.net Gateway==<br />
Many payment gateways are resellers of the popular Authorize.net payment gateway. They may offer better rates and packages, but ultimately they're selling the same technology, except that they use a different URL address for accepting payments. Both Soholaunch Pro and Soholaunch Ultra include a simple, built-in way to change the gateway URL on soho's built-in Authorize.net integration so that you can use Authorize.net reseller gateways.<br />
<br />
===How to change the Authorize===<br />
The Authorize.net gateway URL is composed of two parts...<br />
# The hostname: secure.authorize.net<br />
# The path: /gateway/transact.dll<br />
<br />
These are the two variables that you need to adjust to use your reseller gateway. You can add custom URL and path to the Soholaunch smt_userdata table using special variable names, and Soholaunch will use your custom host and path instead.<br />
<br />
# Go to the Database Tables feature<br />
# Click the System Tables tab.<br />
# Find the smt_userdata table<br />
# Click View/Edit Records<br />
# Add New Record<br />
# prikey (leave blank), plugin = 'cart_authorize', fieldname = 'scHost', data = '[your custom url]' (all those values should be typed WITHOUT the single quotes)<br />
# Save New Record<br />
# Add New Record<br />
# prikey (leave blank), plugin = 'cart_authorize', fieldname = 'scPath', data = '[your custom path]'<br />
# Save New Record<br />
# All done!<br />
<br />
==Add an XML Sitemap to your website==<br />
'''Part one: Generate a sitemap'''<br />
# Visit [http://xml-sitemaps.com xml-sitemaps.com]<br />
# Follow-the instructions to generate an XML sitemap for your site.<br />
# Copy the sitemap it generates (Ctrl+c)<br />
# Open MS Notepad (or Typepad on a Mac)<br />
# Paste in your sitemap (Ctrl+v)<br />
# Save the file as sitemap.xml<br />
<br />
'''Part two: Upload sitemap'''<br />
# Log-in to your sohoadmin<br />
# From the Main Menu, press the F4 key to launch the secret super-tool.<br />
# This screen may look scary, but it will help you upload the sitemap to your home folder.<br />
# Make sure the path at the top shows that you are in the public_html folder<br />
# Click the upload button to select the sitemap.xml file from your computer and upload it<br />
# All done!<br />
<br />
==Verify your site with Google Webmaster Tools==<br />
'''Part one: Add site to your Google account'''<br />
# Log-in to your Google Account<br />
# Go to Google Webmaster Tools<br />
# Click Add a Site<br />
# Click Manage site > Verify this site<br />
# Click the link to Download the HTML verification file<br />
# Save that file to your computer somewhere<br />
<br />
'''Part two: Upload verification file'''<br />
# Log-in to your sohoadmin<br />
# From the Main Menu, press the F4 key to launch the secret super-tool.<br />
# This screen may look scary, but it will help you upload Google's file to your home folder.<br />
# Make sure the path at the top shows that you are in the public_html folder<br />
# Click the upload button to select the Google file from your computer and upload it<br />
<br />
'''Part three: Finalize verification'''<br />
# Go back to Google Webmaster Tools<br />
# Click Verify<br />
# Done!<br />
<br />
==Put a text link on top of an image==<br />
There are a couple ways to put a link on top of an image. Here are two methods.<br />
<br />
===1. Overlay a normal text link on an image.===<br />
The idea here is to set your image as a background image for an element that contains your text link. <br />
<br />
So let's say you have an image called...<br />
kitten.jpg (300px width X 150px height)<br />
<br />
...and you want to lay a text link on it. What you're going to do is create a container element in html that has the same width and height as your image, assign your image to be the background image, and then put your text inside the container element. <br />
<br />
Flip over to the Text Editor's HTML view (you should also do this as a custom code file) and put in some html like below. You can copy-paste this if you'd like.<br />
<pre><br />
<div style="width: 300px;height: 150px;background-image: url('images/kitten.jpg');"><br />
<a href="http://example.com/Kittens.php">Click here to see kittens</a><br />
</div><br />
</pre><br />
<br />
===2. Create an image map===<br />
An image map is a combination of image and code that basically makes certain sections of the image clickable like links. You typically define the sections through a graphical image map maker. There are lots of free standalone products, and image mapping is a built in tool for most major web development software packages (e.g., Adobe Dreamweaver). <br />
<br />
Note that once you use such a program to create an image map, it will give you a bunch of code to insert on your page. Use Soholaunch's "Custom Code" drag-and-drop object to put that on your page.<br />
<br />
===3. Use absolute positioning with CSS===<br />
This is the "advanced" method. If you don't already know what this is, it will take more than a paragraph to explain it well. Going in-depth into CSS positioning would be a little out-of-scope for this page, and lots of people on the web have already done a great job explaining it. But if you're interested and you're the tinkering type, search around for [http://lmgtfy.com/?q=css+positioning+tutorial tutorials on CSS positioning]. You may want to do a few CSS primers first if you've never looked at it before.<br />
<br />
==Install Google Analytics code on your website==<br />
Google Analytics is an ultra-powerful stats package provided by Google for analyzing your website traffic. It will give you a dazzling amount of information about your site visitors.<br />
<br />
To use Google Analytics with your website, you must add Google's special tracking code to all of your site pages. Because Soholaunch uses templates (one master file that controls the style for your whole website), you don't have to worry about adding it to all your pages. You can just add it in one place and be done with it.<br />
<br />
There are two easy ways to add Google's code to your Soholaunch-powered website:<br />
<br />
===1. The Easy Way: Grab a plugin===<br />
Go try one of the [http://addons.soholaunch.com/?pr=Plugins&search_qry=analytics several Google Analytics plugins] available at [http://addons.soholaunch.com Soholaunch Addons]: <br />
<br />
===2. The Hard Way: Edit your template file===<br />
# [http://wiki.soholaunch.com/index.php?title=How_to#Find_your_template_folder First, find your template folder] through [http://wiki.soholaunch.com/index.php?title=How_to#Get_started_with_FTP FTP]<br />
# Locate the index.html file within your template folder<br />
# Follow Google's instructions for adding the code.<br />
# Also note that if your template folder contains a home.html file, you will need to add the Google Code there as well.<br />
<br />
==Export shopping cart products==<br />
Using the Database Tables feature it is possible to export your shopping cart products into a semicolon-delimited .csv file that you can then import into spreadsheets (e.g., Microsoft Excel) and many other systems. <br />
<br />
Here are instructions for exporting your shopping cart products:<br />
# Log-in to sohoadmin<br />
# From the Main Menu, click the Database Tables icon.<br />
# Click the System Tables tab<br />
# Find the "cart_products" table.<br />
# Click the "Download" link.<br />
# Save the file to your local computer<br />
<br />
==Prevent PayPal Order Number Conflicts==<br />
If you are using one paypal account to accept orders on more than one Soholaunch website, you may run into order number conflicts. This usually manifests in an error from PayPal that says something like "Order already exists". <br />
<br />
===The problem===<br />
The Soholaunch Shopping Cart starts it's order numbers off at 10000 and counts up one at a time per order, so your third order will be order #10003. When you use PayPal as your payment gateway, this order number is passed to paypal as the unique identifier number for PayPal.<br />
<br />
Normally, when you just have one website, this is all fine and dandy. But when you have two websites running through the same PayPal account, you start to get conflicts. If you've received three orders from Site A and three orders from Site B, the third order on both sites is going to pass to PayPal as #10003. When the Site B tries to run its third order through, PayPal says "Hey, no...that order number already exists" (because Site A used it earlier).<br />
<br />
===How to fix it===<br />
The fix for the duplicate order number problem is simple enough. You just need to jump the order numbers on one of your site to another range, so that the two order number ranges don't ever overlap.<br />
<br />
You can leave Site A alone in it's 10000 range. For Site B, do this...<br />
# Main Menu<br />
# Database Tables<br />
# System Tables tab<br />
# cart_invoices<br />
# View/Edit Records<br />
# Add New Record<br />
# Specify a really high number like 200000 for the ORDER_NUMBER<br />
# Leave all the other fields blank<br />
# Save<br />
# View table and delete your test record (if you want)<br />
# From now on order numbers will start at whatever number you put in (e.g., 200000)<br />
<br />
==Use special characters in your navigation menu links==<br />
<br />
Soholaunch does not currently support using special characters (anything besides letters, numbers, and spaces) in your site's menu navigation, neither in main page links nor in sub page links.<br />
<br />
Although we are working to improve this in future versions so that you can use whatever characters you want, there are ways to get around the current restriction in the mean time.<br />
<br />
===Method #1: Search and Replace Table===<br />
Let's assume you want to create a page called Lilo & Stitch. Normally, that ampersand will make the Soholaunch paging system <br />
<br />
# Name your page something that works under the standard page naming restrictions, so let's say "Lilo and Stitch".<br />
# Go Main Menu > Database Tables > User Tables > UDT_CONTENT_SEARCH_REPLACE > View/Edit Records<br />
# Add a Record<br />
# Search for: "Lilo and Stitch" (without the quotes)<br />
# Replace with: "Lilo & Stitch" (without the quotes)<br />
<br />
===Method #2: Hard code your menu===<br />
If you are comfortable modifying the html file for your template, you can certainly hard-code your menu navigation directly into the HTML file and use whatever special characters you want.<br />
<br />
==Copy-Paste Content from Microsoft Word==<br />
Pasting from MS Word is always a problem for WYSIWYG editors like the Soholaunch Text Editor, because the content that you copy from Word carries all of this crappy Microsoft psuedo-html code with it. Some of that code works; some of it can't be interpreted by the browser. Hence the funky, half-working result you end up with a lot of times.<br />
<br />
To combat this, we recommend two options:<br />
<br />
1. Instead of normal pasting (Ctrl+V or right-click, paste), use the Paste from Word button inside the Soholaunch Text Editor. Note that this button does not work in FireFox (not for lack of trying). When you hit that button, the soho editor will try to translate the odd MS Word code into to real html code, which will usually yield a bit better results than just normal pasting.<br />
<br />
2. Strip all the formatting before you paste. As in, copy the content from MS Word, paste it in a bare-bones text editor like MS Notepad, then copy from there in to the soho editor and format as you like. This is certainly the most reliable, quirk-free method, though it does require you to re-do your formatting.<br />
<br />
==How to find your FTP login==<br />
If you submit support tickets with us, we will usually ask you for your "FTP" login username and password. If your web hosting company offers "cPanel", then this username/password is probably the same as your "cPanel" user name and password. You usually find this log-in information in the "Welcome" email that your web hosting company sent you when you first signed up with them.<br />
<br />
==How to fix a corrupt page==<br />
Sometimes certain content on a page will break the page editor. Often you don't know this is happening until it's too late and your page is corrupted. <br />
<br />
Symptoms of a corrupt page:<br />
* Page Editor: Fails to load<br />
* Page Editor: Cannot delete objects<br />
* Page Editor: Not all grid squares display<br />
* Page does not display correctly (or at all)<br />
<br />
Cause of corrupt page: Code or script that you have copy-pasted from elsewhere is messing with the page editor.<br />
<br />
If this happens to you the best thing to do is create a new page, then re-place your content from the broken page one element at a time. Of special note: To be extra safe, put all suspicious content on the page using the Custom Code object (which prevents the Page Editor from trying to interpret it).<br />
<br />
Note: Again, the cause of corrupt pages is almost always broken html code that you have copy-pasted, or javascript that you have copy-pasted into the Text Editor. If you need to put javascript or other special code on the page, do it with the Custom Code object.<br />
<br />
Note2: You may have to completely delete the original page and start over.<br />
<br />
Related: [http://wiki.soholaunch.com/index.php?title=How_to#Put_some_HTML_on_a_page_as_a_custom_code How to place something on a page as custom code]<br />
<br />
==How to add anchor links==<br />
Here is how you install anchors to text in Soholaunch:<br />
<br />
# In the text editor, place your cursor at the place where you would like the anchor. Click the anchor button and create a short, single word name for the anchor. Click Insert.<br />
# Now go to the text you would like linked to that anchor and select (highlight) the text.<br />
# Click the insert/edit link button. in the Anchors dropdown select the correct anchor for the text and click insert.<br />
<br />
That should help you. Keep in mind that you create the anchor first and then link text to the anchor. Also, anchors are only valid within the same text editor. If you have multiple text boxes on a page the anchors will not work between separate text boxes.<br />
<br />
==Update to the latest version==<br />
From the Main Menu of /sohoadmin...<br />
# Click the Webmaster buttton on the top nav<br />
# Click the Software Updates button<br />
# Click the big "Check for Updates Now" button<br />
# Select the build you want to install<br />
# Click "Install"<br />
<br />
==Download new language translation files==<br />
Translations of the Soholaunch product are now handled at http://translate.soholuaunch.com. If you speak multiple languages and want to help translate Soholaunch, you can go to that site, sign up for a free account, and start translating immediately.<br />
<br />
At any time you can download the latest language file for a given language. Here's how...<br />
# Go to http://translate.soholaunch.com<br />
# Sign-up/Log-in<br />
# Set language to the language you want to download (e.g., Hebrew)<br />
# Click link at top-left to download latest translation files<br />
<br />
Once you have downloaded the latest language file you can add it to your Soholaunch-powered website by logging-in via FTP, and uploading the hebrew.php (or spanish.php, or whatever.php) file you downloaded to this folder...<br />
public_html/sohoadmin/language<br />
<br />
==Make text scroll like a marquee==<br />
The old Text Editor (< v4.9.3) used to include a "marquee" feature that would allow you to make any block of text scroll across the page. It was absent in the updated version of the Text Editor (v4.9.3) --- and was left out because it was buggy and was more trouble than it seemed worth.<br />
<br />
However, you can still make text scroll like that by switching to HTML View and putting <marquee> tags around the part you want to scroll, like this...<br />
<br />
<marquee>scroll me</marquee><br />
<br />
[http://www.quackit.com/html/codes/html_marquee_code.cfm Check out this website I found for more on the marquee tag and how you can configure it (e.g., speed, etc).]<br />
<br />
==Put some HTML on a page as a custom code==<br />
Sometimes you try to paste some code in the Soholaunch Text Editor and you can't get it to work right. This typically happens with code that people copy-paste from other providers (like PayPal button code). In most of these cases the Text Editor in soho is trying to interpret the code so you can see what it's output looks like, but if there's javascript in there or something it can through the editor off (because it tries to execute the javascript when it gets to it...with all kinds of quirky results).<br />
<br />
Anyhow, you can avoid all these problems by putting your special code in a custom include and dropping it on your page via the Custom Code object. Any code dropped on the page via the Custom Code object is not interpreted until the page itself is loaded by the site visitor.<br />
<br />
This fixes 99.9% of all "I put the code in the Text Editor but it doesn't work." problems.<br />
<br />
# Go to edit the page where you would like to place the custom HTML.<br />
# Drag & Drop the Custom code item onto the page from the menu.<br />
# Select New file and enter a name for the embed.<br />
# Click Create New File.<br />
# Paste in the HTML.<br />
# Click Save.<br />
# Select the file from the dropdown.<br />
# Click OK.<br />
# Save page<br />
<br />
===Alternate method, create your own #variables# for your custom code===<br />
Sometimes you need custom code to display nested within content that you create using the Text Editor. For example, let's say you have a table with two columns and you want to put normal text in one column and Google ads in the other column.<br />
<br />
For this scenario, using the above method (the Custom Code drag-and-drop object) is less than ideal because you can't get precise placement using the Custom Code method (unless you include the whole table in your custom code, but that's for people who know HTML).<br />
<br />
So with this alternate method, instead of placing the custom html directly on the page, you're going to place a custom placeholder variable where you want the custom code to appear, and then use the [http://wiki.soholaunch.com/index.php?title=UDT_CONTENT_SEARCH_REPLACE UDT_CONTENT_SEARCH_REPLACE] table to replace that placeholder with the actual code when the page loads for the site visitor.<br />
<br />
Here are the steps to follow...<br />
# In the Text Editor place something the text "#mycodewillgohere#" (without the quotes) where you want the custom code to show up. This is going to be your placeholder variable. You can use whatever text you want. For example, it could be #emilyscoolvariable#...it doesn't matter, as long as it's not one of the [http://wiki.soholaunch.com/index.php?title=Custom_Template_Reference#Pound_Variables reserved variables].<br />
# Press the Update button in the Text Editor to apply your changes<br />
# Press the Save Page button.<br />
# Go to the Main Menu<br />
# Click Database Tables<br />
# Under User Tables, View/Edit Records in the UDT_CONTENT_SEARCH_REPLACE table.<br />
# Press the Add New Record button<br />
# For the "Search For" field, enter your placeholder variable (e.g., #mycodewillgohere# or #emilyscoolvariable#)<br />
# For the "Replace With" field, paste in your custom code.<br />
# Save Record.<br />
# View website. Your code should work when the is viewed, but remain as a #variable# while you're editing the page.<br />
<br />
The bonus of this method is that you can now use that #mycodewillgohere# variable ANYWHERE on your website, as many times as you want (instead of having to frequently copy-paste your custom code everywhere, you can just type that variable name).<br />
<br />
==Get started with FTP==<br />
FTP (File Transfer Protocol) is like Windows Explorer for your website's files. Often, especially when you start tinkering with your template html and css, you'll need a way to access files that the Soholaunch tool itself doesn't provide you direct access to....a way to get behind the curtain a little. This is what FTP is for.<br />
<br />
One of the better FTP clients out there is also free. It's called FileZilla. You can download it here...<br />
http://filezilla-project.org/<br />
<br />
In order to get at your template folder...<br />
# Go download filezilla (http://filezilla-project.org/)<br />
# Install it on your computer<br />
# At the top you'll see fields for host, username, and password. For "host" just fill-in your domain name (e.g., example.com). You username and password are typically the same as your cpanel usename and password. If you can't get the right username/password, check the welcome email from your web hosting company. If you can't find that, contact your web hosting company and ask them for you ftp username/password <br />
# Once you're in through ftp, [http://wiki.soholaunch.com/index.php?title=How_to#Find_your_template_folder locate your template folder]<br />
# The two files you are probably looking for are index.html and custom.css. See: [http://wiki.soholaunch.com/index.php?title=Custom_Template_Reference#Template_folder_and_files Template Folder and Files]<br />
# Download the file you want to modify to your PC, make your changes, then upload it back to your site...all though this FileZilla FTP program.<br />
<br />
==Modify your custom.css file==<br />
Most templates --- including all factory templates and most templates available on the [[http://addons.soholaunch.com|Soholaunch Addons]] website --- make use of a file called custom.css. This file contains all (or mostly all) of the styles that affect how your template looks and feels.<br />
<br />
If you want to make color, style, etc changes to your template, chances are what you are looking for is located in your template's custom.css file.<br />
<br />
You can find this file in your template folder.<br />
<br />
==Move your site to a different server==<br />
# Sign-up for new hosting account<br />
# Get temporary access url from your new web hosting company<br />
# Use temporary url to install Soholaunch to new hosting space (via Fantastico or our installsoholaunch.php script)<br />
# Back on your OLD server, log-in to sohoadmin. <br />
# Go to the Webmaster menu.<br />
# Click the Site Mover tool<br />
# Click Move this Site<br />
# Download that file it creates<br />
# On your NEW server, log-in to sohoadmin.<br />
# Go to Webmaster Menu.<br />
# Click Site Mover tool<br />
# Upload your transfer file<br />
# At your domain registrar, re-point your domain name<br />
<br />
==Add a custom redirect to a page==<br />
Here is the code to do a proper (search engine-friendly) redirect. Put this php code in a file, call it "whatever.php", and drop it on the page you want to redirect via the Custom Code object in the Page Editor.<br />
<br />
Make sure to change that "redirectohere.example.com" address.<br />
<br />
<?php<br />
header("HTTP/1.1 301 Moved Permanently");<br />
header("location: http://redirectohere.example.com");<br />
exit;<br />
?><br />
<br />
==Maximize the admin/editing window in Internet Explorer==<br />
The sohoadmin window is designed to run in a fixed size of a little smaller than 800x600 dimensions to make sure it fits on all monitor resolutions.<br />
<br />
However, sometimes it can be handy to be able to make the admin window larger if you have enough screen real-estate to do so. If you are using a browser besides Internet Explorer, like Mozilla FireFox (our recommended browser), then you can simply drag the bottom-right corner of your browser window to resize it. <br />
<br />
But if you're using Internet Explorer then follow these steps...<br />
<br />
1. Log-in to sohoadmin<br />
<br />
2. Close the sohoadmin window after it launches<br />
<br />
3. You should be looking at the "Click here to re-launch admin window" screen.<br />
<br />
4. In the address bar you'll see a URL like this...<br />
http://example.com/sohoadmin/index.php<br />
<br />
5. Change it to this...<br />
http://example.com/sohoadmin/version.php<br />
<br />
6. Hit the Enter key<br />
<br />
7. Admin window will re-launch and be resizeable<br />
<br />
==Add fonts to the new Text Editor==<br />
===CIA Fonts will not work with v4.9.2+===<br />
In versions prior to v4.9.2 there was a plugin called CIA Fonts on the Soholaunch Addons website that made it easy to add fonts to the Text Editor. But as of v4.9.2 this plugin will no longer work (until it is updated...hint, hint Thomas), because v4.9.2+ builds incorporate a completely different text editor. <br />
<br />
===The new workaround method for sites running v4.9.2+===<br />
Until an easier solution is created (which should happen before too long), you can still add fonts to the new editor, but not quite as easily as you could with the old editor and CIA Fonts. <br />
<br />
Here's how to add fonts to the new Text Editor<br />
<br />
;Note: You '''must be running''' at least '''v4.9.2 r7+''' to add fonts using this method...'''<br />
#Go to Database Table Manager<br />
#Click the "System tables" tab<br />
#Find the '''smt_userdata''' table<br />
#Click View/Edit Records<br />
#Using the search box at the top left run a search on "customfonts" (without the qoutes). Only one record should be returned.<br />
#Edit that record<br />
#Add fonts to that "data" field (details below) and hit the Save Changed Data button<br />
<br />
====Format of fonts list====<br />
The "data" field contains a list of all the fonts available in the Text Editor. You may want to copy-paste the content of the data field into a text/code editor like Dreamweaver or MS Notepad so you can see them all on one line instead of wrapped into multiple lines. Then when you're done editing the list just copy-paste it back into the text field you took it out of and save the record.<br />
<br />
''Example content of "data" field in "customfonts" record...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif<br />
<br />
The font choices are separated by semicolon ";". Each font choice has two parts, separated by an equals sign (=). The first part (e.g., Arial) is the font name as it will display in the Text Editor and doesn't matter (i.e., you could call it "Billyfont". The second part is what actually affects what font will show on the website --- the proper font-family syntax for the html/css code. Some fonts in the second part specify multiple comma-separated fonts --- these are alternates to use if the preceding font isn't available.<br />
<br />
Adding "Trebuchet" to the font list...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;Trebuchet=Trebuchet MS,verdana,arial,sans-serif<br />
<br />
Again, the display name doesn't really matter, and the multiple comma-separated alternative fonts are note required either, so could just have...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;MyFavoriteFont=Trebuchet MS<br />
<br />
When you're done editing the font list in the data field just hit the Save Changed Data to update the record and you're done! Your new font will be available in the Text Editor now.<br />
<br />
==Find out what version of Soholaunch you're running==<br />
[[Image:Howto_find_your_version_no.gif]]<br />
<br />
The installed version number is located in the bottom-right of the admin tool window, in the footer.<br />
<br />
==Create an auto-reply email address field in the Web Form builder==<br />
In the form builder...<br />
<br />
#Click the "(+) Add Field" button<br />
#Click the "Email Address" field<br />
<br />
==Uninstall Soholaunch manually==<br />
Note: This will kill the entire website. Do not do this unless you're positive this is what you want to do. This is meant for people who installed Soholaunch manually (i.e. via installsoholaunch.php) on a website they don't want it on and now want to uninstall it.<br />
<br />
Using your preferred code editor (MS Notepad will work if you don't have a code editor of choice), create a new file (save it as deleteitall.php or something) containing this code....<br />
<pre><br />
<?<br />
shell_exec("rm -rf media");<br />
shell_exec("rm -rf images");<br />
shell_exec("rm -rf import");<br />
shell_exec("rm -rf tCustom");<br />
shell_exec("rm -rf template");<br />
shell_exec("rm -rf shopping");<br />
shell_exec("rm -rf sohoadmin");<br />
echo "Done! It's all gone!";<br />
?><br />
</pre><br />
<br />
...now save that file as something like "deleteitall.php", upload it to your document root folder (i.e. public_html, htdocs, etc.) via FTP and point your browser to websiteyouwantokill.com/deleteitall.php.<br />
<br />
==Offer your customers your own template collection==<br />
To make your custom templates available to every user on your server, wrap them all up in a zip file and upload them somewhere...it can be anywhere, as long as it's accessible from the internet.<br />
<br />
For example, let's say you upload your .zip file full of templates to...<br />
ourmaincompanywebsite.com/soho/our_templates.zip<br />
<br />
Then log-in to the Partner Area and go to "Branding Controls". Under "Templates" check the "My own templates" box, for the "URL path to template library .zip..." field fill-in<br />
http://ourmaincompanywebsite.com/soho/our_templates.zip<br />
<br />
Then scroll down and hit the "Save Options" button. Done! From now on whenever a new Soholaunch-powered website is set up on your server(s), your template library will be downloaded and installed automatically.<br />
<br />
==Rename/Delete a page that won't delete==<br />
Usually, if you can't delete a page it's because it has some trouble characters in its name like an ampersand (&) or something. In order to delete the page you'll have to rename it first. And you'll have to rename it "the hard way" because that ampersand won't let you rename it "the easy way" (via Page Properties) for the same reason it won't let you delete the page.<br />
<br />
So here's the step by step for manually renaming a page called "Milo & Otis" to "Milo and Otis" so it won't give you any more problems.<br />
#Go to Main Menu > Database Table Manager<br />
#Select the site_pages table from the drop-down menu<br />
#Hit the "Enter/Edit Record Data" button<br />
#When the table pulls up click the link on the top right that says "Run custom query"<br />
#Put the following tn the text box that pops-up and hit the "Run Query" button...<br />
update site_pages set page_name = 'Milo and Otis' where page_name = 'Milo & Otis'<br />
<br />
Once you follow these steps you should be able to delete, rename, etc the page as normal.<br />
<br />
==Find/Edit custom table search includes==<br />
Via FTP, the files are located here...<br />
[public_html]/media<br />
<br />
File naming convention...<br />
udt-search_[search name].inc<br />
<br />
Example file name...<br />
udt-search_joes_cool_search.inc<br />
<br />
You can download these files to your PC, modify them, then upload them back to that /media folder and you're good to go.<br />
<br />
==Link to specific shopping cart sku==<br />
Go to your website and browse your shopping cart. Click the Buy Now/More Information link for the product you want to link to, then copy the url from your address bar. Should look something like this...<br />
<br />
http://provx.soholaunch.com/shopping/pgm-more_information.php?id=1<br />
<br />
Advanced Note: That id # matches the prikey value of that sku in the cart_products table.<br />
<br />
==Link to specific shopping cart category==<br />
Go to your website and browse your shopping cart. In the search column you'll see a list of links to your categories (in the search column). Click on the link to the category you want, then copy the url from your address bar. Should look something like this...<br />
<br />
http://yourdomain.com/shopping/start.php?browse=1&cat=25<br />
<br />
==Link to specific month/year in you event calendar==<br />
In the text editor, select the text you want to link and hit the little link icon/button next to the paint bucket. Then in the link dialog that pops up, in the field that says "(or) Link / Anchor:" and has "http://" already in the field, do this...<br />
<br />
http://yourdomain.com/About_Us.php?SEL_MONTH=04&SEL_YEAR=2007<br />
<br />
Note: Replace "About_Us" with the name of the page that you dropped you're calendar on, and replace the month and year numbers with whatever month/year you want to jump to.<br />
<br />
==Reset your hit counter==<br />
#Log-in to your site via FTP<br />
#Browse to the "sohoadmin/filebin/" folder<br />
#Delete hitcounter.txt<br />
<br />
==Move license from subdomain to primary domain==<br />
#Log-in to the partner area<br />
#Click on "Lifetime Licenses"<br />
#Delete the license listed for your subdomain<br />
#Click "Add Domain"<br />
#Fill-in the name of your primary domain and click "Generate License"<br />
<br />
==Download page content files==<br />
Via FTP, the files are located here...<br />
[public_html]/sohoadmin/tmp_content<br />
<br />
===What's the difference between CON and REGEN files?===<br />
In short, CON files are for the website-side, REGEN files are for the admin-side. <br />
<br />
;CON files: When a visitor views a page on your website, script files read the CON file for that page and use it to build the final HTML for the page. CON files tell the website-side scripts that you've got a cart item, a login box, and this text on this page.<br />
<br />
;REGEN files: These are used by Soholaunch's Page Editor. When you open a page in Soholaunch to edit it, the REGEN file for that page is read and it tells the product what objects are on the page and which dropzones to display them in.<br />
<br />
When you save a page in the Page Editor, it saves a REGEN file for that page so it knows what edit options to show you in the Page Editor the next time you edit that page, and then it builds a CON file for the page so that the website-side scripts know what to display to site visitors.<br />
<br />
==Upload video files via FTP==<br />
Via FTP, the files are located here...<br />
[public_html]/media<br />
<br />
==Find/Edit the default contact forms==<br />
'''Contact forms'''<br><br />
Via FTP, the files are located here...<br />
[public_html]/sohoadmin/program/modules/page_editor/formlib/forms<br />
<br />
The files are:<br />
*Contact_Form_(Basic).form<br />
*General_Email_Form.form<br />
<br />
'''Newsletter quick signup form'''<br><br />
The file for this is located here...<br />
[public_html]/sohoadmin/program/modules/page_editor/formlib/newsletter/Quick-N-Easy_Signup.form<br />
<br />
'''Points to remember:'''<br />
*Though they're technicaly just html files, make sure to preserve the .form extension when you upload them back to your site so the system can recognize them (which is the whole idea behind the .form extension --- so know it's a form).<br />
<br />
==Find your template folder==<br />
'''1. Log-in via FTP to your website and navigate to this folder...'''<br />
public_html/sohoadmin/program/modules/site_templates/pages/<br />
<br />
'''2. Find the folder for your specific template.'''<br />
This is the naming convention for template folders..<br />
CATEGORY-Template_Name-Color<br />
<br />
So if you're using CORPORATE > A_Curvacious_Mark (Blue), your template folder would be...<br />
CORPORATE-A_Curvacious_Mark-Blue<br />
<br />
...and the full path from your home directory would be:<br />
public_html/sohoadmin/program/modules/site_templates/pages/CORPORATE-A_Curvacious_Mark-Blue<br />
<br />
==Swap out your template header text for a logo image==<br />
1. Download the '''index.html''' file from your [[#Find your template folder|template folder]]<br />
<br />
2. Find (ctrl+f) '''"#LOGO#"'''<br />
<br />
3. Replace it with '''"#LOGOIMG#"'''<br />
<br />
4. Save the file and upload it back to your template folder<br />
<br />
You can now add and change the logo image in your template via Template Manager (where it says choose logo image). <br />
<br />
The same logic applies if you want to change your logo text to something else or add other information right around it. For example, if your template allows for header text via #LOGO# and you want slogan text too, you could find that #LOGO# in your template's .html file but instead of replacing it with #LOGOIMG# you could change it to something like...<br />
<br />
'''Example: Apply same logic to add slogan text'''<br />
<br />
''Original line in template's index.html file...''<br />
#LOGO#<br />
<br />
''Add a line break and the pound-variable for slogan text...''<br />
#LOGO#<br>#SLOGAN#<br />
<br />
Complete list of available pound variables like #LOGO#, #LOGOIMG#, and #SLOGAN#, see [[Custom_Template_Reference|custom template reference]].<br />
<br />
==Set background image==<br />
1. '''Log-in via FTP and find your template's folder...'''<br />
<br />
2. '''Upload the image you want to use''' as your background to that folder<br />
<br />
3. '''Download the custom.css file''' that's in there and open it up in your code editor of choice (or notepad will work if nothing else)<br />
<br />
4. '''Add in this code...'''<br />
body { background-image: url(mybackgroundimage.gif); }<br />
<br />
5. '''Save the file (custom.css)''' and upload it back to your template's folder<br />
<br />
==Make a button that links to another website, but opens that link in a new window==<br />
<br />
'''Solution:''' Pull up the Text Editor where you put in the button, click on the "HTML" button at the bottom left. <br />
<br />
The HTML for your button should look something like this...<br />
<pre><input type="button" style="width: 163px; color: <br />
rgb(29, 0, 237); height: 24px; background-color: rgb(249, 186, 0);"<br />
size="217" value="Click here to go to example.com"></pre><br />
<br />
To make this button link to "www.example.com", insert the following "onclick" attribute...<br />
<pre>onclick="window.open('http://www.example.com','', <br />
'width=800px,height=600px,resizable');"</pre><br />
<br />
So the full code for the button should look something like...<br />
<pre><input type="button" onclick="window.open('http://www.example.com','',<br />
'width=800px, height=600px,resizable');"<br />
style="width: 163px; color: rgb(29, 0, 237); <br />
height: 24px; background-color: rgb(249, 186, 0);" <br />
size="217" value="My Button"></pre><br />
<br />
Just replace "www.example.com" with the site you want to link to, and you're good to go.<br />
<br />
==Install Soholaunch on a subdomain manually via cPanel==<br />
How to install manually on subdomain....<br />
<br />
http://soholaunch.com<br />
# Download installer<br />
<br />
cPanel<br />
# Create database<br />
# Create user<br />
# Add user to database<br />
<br />
Local PC<br />
# Extract installsoholaunch.zip somewhere<br />
<br />
FTP Client<br />
# Upload installsoholaunch.php to root of subfolder for subdomain (e.g., "public_html/fr" for "fr.domain.com")<br />
<br />
Browser<br />
# Go to yourdomain.com/installsoholaunch.php<br />
# Click install button<br />
# Fill-out setup form with database info (db name, username, password you just created in cPanel)<br />
# Done installing!<br />
<br />
==Import a large number of shopping cart items at once==<br />
# Log-in to sohoadmin (yourdomain.com/sohoadmin)<br />
# Main Menu > Database Tables > System Tables tab<br />
# Scroll until you see the "cart_products" table. If it does not exist, return to the Main Menu and click the Shopping Cart icon once, wait for the Shopping Cart menu to load (the one with buttons that say things like Shipping Options, Find/Edit Products, Tax Options, etc), and then go back to Database Tables > System Tables (so basically start over at step #2 above).<br />
# Next to the "cart_products" name you'll see a Download link. Click that to download the table in CSV format.<br />
# Open Microsoft Excel, create a new spreadsheet<br />
# In Excel, do this: Data > Import External Data > (select the file you downloaded) > Semicolon delimited > Finish<br />
# Now you have all the right column names set up in your spreadsheet, you can start filling it out with all your product info.<br />
# When you've got it filled out, Save As > CSV file (semicolon delimited) > Yes on the warning prompt about losing funcitonality<br />
# Back in sohoadmin, go to Main Menu > File Manager > Upload Files<br />
# Upload the .csv file you just saved your spreadsheet to.<br />
# Go back to sohoadmin > Main Menu > Database Tables > System tables tab<br />
# Next to cart_products, click the Import link. <br />
# Select the CSV file you uploaded, then follow the prompts to make sure that your column names match up.<br />
# Once you finish the Import action, you're all done!<br />
<br />
'''Note1:''' If you already have a spreadsheet full of shopping cart items, skip to step 8<br />
<br />
'''Note2:''' The PROD_CATEGORY fields use the keyfield numbers from the cart_category table, which you can also view via Database Tables > System Tables tab > View/Edit Records<br />
<br />
'''Note3:''' You can also use this import feature to ''update'' many cart items at one time.<br />
<br />
'''Note4:''' Always use the Backup/Restore to make a backup first!<br />
<br />
==Transfer shopping cart items from one site to another==<br />
<br />
sohoadmin for Main site (e.g, yourdomain.com)<br />
# Database Tables feature<br />
# System Tables<br />
# cart_products<br />
# Click the download link<br />
# Save that somewhere on your PC<br />
<br />
sohoadmin for subdomain (e.g., fr.yourdomain.com)<br />
# File Manager<br />
# Upload Files<br />
# Upload csv file that you downloaded<br />
# Database Tables<br />
# System Tables<br />
# cart_products<br />
# Import<br />
# Follow instructions<br />
<br />
==Make blog sort by earliest-to-latest, instead of latest-to-earliest.==<br />
1. Log-in via FTP, browse to your public_html folder<br />
<br />
2. Download pgm-blog_display.php<br />
<br />
3. Modify sort order by finding this line...<br />
$blog_qry = "ORDER BY timestamp DESC, PRIKEY DESC LIMIT 15"; // Limit by 15<br />
<br />
to this...<br />
$blog_qry = "ORDER BY timestamp DESC, PRIKEY ASC LIMIT 15"; // Limit by 15<br />
<br />
4. To be safe, find all other instances of "DESC" and replace them with "ASC".<br />
<br />
5. Save. Upload your modified pgm-blog_display.php TO YOUR TEMPLATE FOLDER. If Soholaunch finds a pgm-blog_display.php in your template folder, it will use it instead of the standard file.<br />
<br />
==Enable pre-release testing builds==<br />
Sometimes we will release small version updates to address specific problems on client websites (or to test new features). You can think of these builds as "nightly" or "beta" builds. They come with no guarantees about reliability, and you should not update to them unless you are installing on a development site, or unless a member of the Soholaunch support staff tells you to update to it.<br />
<br />
By default, you cannot see these beta builds in the Software Updates feature. You need to enable them. Here's how to do that...<br />
# From your sohoadmin control panel, go here: Main Menu > Webmaster > Software Updates<br />
# Click the link that looks like this: "[?] Technical diagnostic info (for geeks)"<br />
# This will open a popup layer. Look at the bottom of the popup.<br />
# Set this option to "Yes/Enabled": "Enable pre-release testing builds"<br />
# Close popup and click the Check For Updates button again<br />
# You should see the beta build listed as available to install (note a beta build is not always available).<br />
<br />
==Create a database with cPanel==<br />
All Soholaunch installations require a database, along with an associated database user/pass. Here's how to create a MySQL database and assign a user to it using cPanel.<br />
<br />
===Step 1: Create the Database===<br />
# Log-in to cPanel (yourdomain.com/cpanel)<br />
# Find the icon for MySQL Databases. Click it.<br />
# Under the Create New Database heading, fill in a name in the text field (note that usually every database is prefixed with your cPanel username, which is shown before the text field). Usually, I just type in "soho" for the database name, making the full database name "[username]_soho"<br />
# Click the Create New Database button.<br />
# Now your database is created.<br />
<br />
===Step 2: Create a User===<br />
Now you need to create a user/pass for the database.<br />
# Still on the MySQL Databases page, scroll down under Add New User.<br />
# Fill in a name. This is like the database name. You're only going to use it once and you won't need to remember it for more than the next 5 minutes. Keep it short and use letters only.<br />
# Note: Like the database name, the username is prefixed is by your cPanel username.<br />
# For the password, just use the password generator and copy it down somewhere temporary. Again, you will only need this password for the next 5 minutes of your life.<br />
# Click the Create User button.<br />
<br />
===Assign the user to the database===<br />
*Why this is necessary:* In case you're curious as to why we have to do this: All you've done so far is create a user for the database. Right now, this user has no authority. He's just an empty shell of a user, lonely and without a database to work on. You need to associate this new user with the database.<br />
<br />
# Scroll down to the Add User to Database section (underneath where you created the user).<br />
# Select the name of the user you just created from the first dropdown.<br />
# Select the name of the database you created in Step 1 from the second dropdown.<br />
# Click the Add button<br />
# Check the box for All Privileges<br />
# Click the Add button<br />
# All done!</div>Sohohttps://wiki.soholaunch.com/index.php?title=How_toHow to2013-12-16T18:31:12Z<p>Soho: /* Add an XML Sitemap to your website */</p>
<hr />
<div>==Use an Authorize.net Gateway==<br />
Many payment gateways are resellers of the popular Authorize.net payment gateway. They may offer better rates and packages, but ultimately they're selling the same technology, except that they use a different URL address for accepting payments. Both Soholaunch Pro and Soholaunch Ultra include a simple, built-in way to change the gateway URL on soho's built-in Authorize.net integration so that you can use Authorize.net reseller gateways.<br />
<br />
===How to change the Authorize==<br />
The Authorize.net gateway URL is composed of two parts...<br />
# The hostname: secure.authorize.net<br />
# The path: /gateway/transact.dll<br />
<br />
These are the two variables that you need to adjust to use your reseller gateway. You can add custom URL and path to the Soholaunch smt_userdata table using special variable names, and Soholaunch will use your custom host and path instead.<br />
<br />
# Go to the Database Tables feature<br />
# Click the System Tables tab.<br />
# Find the smt_userdata table<br />
# Click View/Edit Records<br />
# Add New Record<br />
# prikey (leave blank), plugin = 'cart_authorize', fieldname = 'scHost', data = '[your custom url]' (all those values should be typed WITHOUT the single quotes)<br />
# Save New Record<br />
# Add New Record<br />
# prikey (leave blank), plugin = 'cart_authorize', fieldname = 'scPath', data = '[your custom path]'<br />
# Save New Record<br />
# All done!<br />
<br />
<br />
==Add an XML Sitemap to your website==<br />
'''Part one: Generate a sitemap'''<br />
# Visit [http://xml-sitemaps.com xml-sitemaps.com]<br />
# Follow-the instructions to generate an XML sitemap for your site.<br />
# Copy the sitemap it generates (Ctrl+c)<br />
# Open MS Notepad (or Typepad on a Mac)<br />
# Paste in your sitemap (Ctrl+v)<br />
# Save the file as sitemap.xml<br />
<br />
'''Part two: Upload sitemap'''<br />
# Log-in to your sohoadmin<br />
# From the Main Menu, press the F4 key to launch the secret super-tool.<br />
# This screen may look scary, but it will help you upload the sitemap to your home folder.<br />
# Make sure the path at the top shows that you are in the public_html folder<br />
# Click the upload button to select the sitemap.xml file from your computer and upload it<br />
# All done!<br />
<br />
==Verify your site with Google Webmaster Tools==<br />
'''Part one: Add site to your Google account'''<br />
# Log-in to your Google Account<br />
# Go to Google Webmaster Tools<br />
# Click Add a Site<br />
# Click Manage site > Verify this site<br />
# Click the link to Download the HTML verification file<br />
# Save that file to your computer somewhere<br />
<br />
'''Part two: Upload verification file'''<br />
# Log-in to your sohoadmin<br />
# From the Main Menu, press the F4 key to launch the secret super-tool.<br />
# This screen may look scary, but it will help you upload Google's file to your home folder.<br />
# Make sure the path at the top shows that you are in the public_html folder<br />
# Click the upload button to select the Google file from your computer and upload it<br />
<br />
'''Part three: Finalize verification'''<br />
# Go back to Google Webmaster Tools<br />
# Click Verify<br />
# Done!<br />
<br />
==Put a text link on top of an image==<br />
There are a couple ways to put a link on top of an image. Here are two methods.<br />
<br />
===1. Overlay a normal text link on an image.===<br />
The idea here is to set your image as a background image for an element that contains your text link. <br />
<br />
So let's say you have an image called...<br />
kitten.jpg (300px width X 150px height)<br />
<br />
...and you want to lay a text link on it. What you're going to do is create a container element in html that has the same width and height as your image, assign your image to be the background image, and then put your text inside the container element. <br />
<br />
Flip over to the Text Editor's HTML view (you should also do this as a custom code file) and put in some html like below. You can copy-paste this if you'd like.<br />
<pre><br />
<div style="width: 300px;height: 150px;background-image: url('images/kitten.jpg');"><br />
<a href="http://example.com/Kittens.php">Click here to see kittens</a><br />
</div><br />
</pre><br />
<br />
===2. Create an image map===<br />
An image map is a combination of image and code that basically makes certain sections of the image clickable like links. You typically define the sections through a graphical image map maker. There are lots of free standalone products, and image mapping is a built in tool for most major web development software packages (e.g., Adobe Dreamweaver). <br />
<br />
Note that once you use such a program to create an image map, it will give you a bunch of code to insert on your page. Use Soholaunch's "Custom Code" drag-and-drop object to put that on your page.<br />
<br />
===3. Use absolute positioning with CSS===<br />
This is the "advanced" method. If you don't already know what this is, it will take more than a paragraph to explain it well. Going in-depth into CSS positioning would be a little out-of-scope for this page, and lots of people on the web have already done a great job explaining it. But if you're interested and you're the tinkering type, search around for [http://lmgtfy.com/?q=css+positioning+tutorial tutorials on CSS positioning]. You may want to do a few CSS primers first if you've never looked at it before.<br />
<br />
==Install Google Analytics code on your website==<br />
Google Analytics is an ultra-powerful stats package provided by Google for analyzing your website traffic. It will give you a dazzling amount of information about your site visitors.<br />
<br />
To use Google Analytics with your website, you must add Google's special tracking code to all of your site pages. Because Soholaunch uses templates (one master file that controls the style for your whole website), you don't have to worry about adding it to all your pages. You can just add it in one place and be done with it.<br />
<br />
There are two easy ways to add Google's code to your Soholaunch-powered website:<br />
<br />
===1. The Easy Way: Grab a plugin===<br />
Go try one of the [http://addons.soholaunch.com/?pr=Plugins&search_qry=analytics several Google Analytics plugins] available at [http://addons.soholaunch.com Soholaunch Addons]: <br />
<br />
===2. The Hard Way: Edit your template file===<br />
# [http://wiki.soholaunch.com/index.php?title=How_to#Find_your_template_folder First, find your template folder] through [http://wiki.soholaunch.com/index.php?title=How_to#Get_started_with_FTP FTP]<br />
# Locate the index.html file within your template folder<br />
# Follow Google's instructions for adding the code.<br />
# Also note that if your template folder contains a home.html file, you will need to add the Google Code there as well.<br />
<br />
==Export shopping cart products==<br />
Using the Database Tables feature it is possible to export your shopping cart products into a semicolon-delimited .csv file that you can then import into spreadsheets (e.g., Microsoft Excel) and many other systems. <br />
<br />
Here are instructions for exporting your shopping cart products:<br />
# Log-in to sohoadmin<br />
# From the Main Menu, click the Database Tables icon.<br />
# Click the System Tables tab<br />
# Find the "cart_products" table.<br />
# Click the "Download" link.<br />
# Save the file to your local computer<br />
<br />
==Prevent PayPal Order Number Conflicts==<br />
If you are using one paypal account to accept orders on more than one Soholaunch website, you may run into order number conflicts. This usually manifests in an error from PayPal that says something like "Order already exists". <br />
<br />
===The problem===<br />
The Soholaunch Shopping Cart starts it's order numbers off at 10000 and counts up one at a time per order, so your third order will be order #10003. When you use PayPal as your payment gateway, this order number is passed to paypal as the unique identifier number for PayPal.<br />
<br />
Normally, when you just have one website, this is all fine and dandy. But when you have two websites running through the same PayPal account, you start to get conflicts. If you've received three orders from Site A and three orders from Site B, the third order on both sites is going to pass to PayPal as #10003. When the Site B tries to run its third order through, PayPal says "Hey, no...that order number already exists" (because Site A used it earlier).<br />
<br />
===How to fix it===<br />
The fix for the duplicate order number problem is simple enough. You just need to jump the order numbers on one of your site to another range, so that the two order number ranges don't ever overlap.<br />
<br />
You can leave Site A alone in it's 10000 range. For Site B, do this...<br />
# Main Menu<br />
# Database Tables<br />
# System Tables tab<br />
# cart_invoices<br />
# View/Edit Records<br />
# Add New Record<br />
# Specify a really high number like 200000 for the ORDER_NUMBER<br />
# Leave all the other fields blank<br />
# Save<br />
# View table and delete your test record (if you want)<br />
# From now on order numbers will start at whatever number you put in (e.g., 200000)<br />
<br />
==Use special characters in your navigation menu links==<br />
<br />
Soholaunch does not currently support using special characters (anything besides letters, numbers, and spaces) in your site's menu navigation, neither in main page links nor in sub page links.<br />
<br />
Although we are working to improve this in future versions so that you can use whatever characters you want, there are ways to get around the current restriction in the mean time.<br />
<br />
===Method #1: Search and Replace Table===<br />
Let's assume you want to create a page called Lilo & Stitch. Normally, that ampersand will make the Soholaunch paging system <br />
<br />
# Name your page something that works under the standard page naming restrictions, so let's say "Lilo and Stitch".<br />
# Go Main Menu > Database Tables > User Tables > UDT_CONTENT_SEARCH_REPLACE > View/Edit Records<br />
# Add a Record<br />
# Search for: "Lilo and Stitch" (without the quotes)<br />
# Replace with: "Lilo & Stitch" (without the quotes)<br />
<br />
===Method #2: Hard code your menu===<br />
If you are comfortable modifying the html file for your template, you can certainly hard-code your menu navigation directly into the HTML file and use whatever special characters you want.<br />
<br />
==Copy-Paste Content from Microsoft Word==<br />
Pasting from MS Word is always a problem for WYSIWYG editors like the Soholaunch Text Editor, because the content that you copy from Word carries all of this crappy Microsoft psuedo-html code with it. Some of that code works; some of it can't be interpreted by the browser. Hence the funky, half-working result you end up with a lot of times.<br />
<br />
To combat this, we recommend two options:<br />
<br />
1. Instead of normal pasting (Ctrl+V or right-click, paste), use the Paste from Word button inside the Soholaunch Text Editor. Note that this button does not work in FireFox (not for lack of trying). When you hit that button, the soho editor will try to translate the odd MS Word code into to real html code, which will usually yield a bit better results than just normal pasting.<br />
<br />
2. Strip all the formatting before you paste. As in, copy the content from MS Word, paste it in a bare-bones text editor like MS Notepad, then copy from there in to the soho editor and format as you like. This is certainly the most reliable, quirk-free method, though it does require you to re-do your formatting.<br />
<br />
==How to find your FTP login==<br />
If you submit support tickets with us, we will usually ask you for your "FTP" login username and password. If your web hosting company offers "cPanel", then this username/password is probably the same as your "cPanel" user name and password. You usually find this log-in information in the "Welcome" email that your web hosting company sent you when you first signed up with them.<br />
<br />
==How to fix a corrupt page==<br />
Sometimes certain content on a page will break the page editor. Often you don't know this is happening until it's too late and your page is corrupted. <br />
<br />
Symptoms of a corrupt page:<br />
* Page Editor: Fails to load<br />
* Page Editor: Cannot delete objects<br />
* Page Editor: Not all grid squares display<br />
* Page does not display correctly (or at all)<br />
<br />
Cause of corrupt page: Code or script that you have copy-pasted from elsewhere is messing with the page editor.<br />
<br />
If this happens to you the best thing to do is create a new page, then re-place your content from the broken page one element at a time. Of special note: To be extra safe, put all suspicious content on the page using the Custom Code object (which prevents the Page Editor from trying to interpret it).<br />
<br />
Note: Again, the cause of corrupt pages is almost always broken html code that you have copy-pasted, or javascript that you have copy-pasted into the Text Editor. If you need to put javascript or other special code on the page, do it with the Custom Code object.<br />
<br />
Note2: You may have to completely delete the original page and start over.<br />
<br />
Related: [http://wiki.soholaunch.com/index.php?title=How_to#Put_some_HTML_on_a_page_as_a_custom_code How to place something on a page as custom code]<br />
<br />
==How to add anchor links==<br />
Here is how you install anchors to text in Soholaunch:<br />
<br />
# In the text editor, place your cursor at the place where you would like the anchor. Click the anchor button and create a short, single word name for the anchor. Click Insert.<br />
# Now go to the text you would like linked to that anchor and select (highlight) the text.<br />
# Click the insert/edit link button. in the Anchors dropdown select the correct anchor for the text and click insert.<br />
<br />
That should help you. Keep in mind that you create the anchor first and then link text to the anchor. Also, anchors are only valid within the same text editor. If you have multiple text boxes on a page the anchors will not work between separate text boxes.<br />
<br />
==Update to the latest version==<br />
From the Main Menu of /sohoadmin...<br />
# Click the Webmaster buttton on the top nav<br />
# Click the Software Updates button<br />
# Click the big "Check for Updates Now" button<br />
# Select the build you want to install<br />
# Click "Install"<br />
<br />
==Download new language translation files==<br />
Translations of the Soholaunch product are now handled at http://translate.soholuaunch.com. If you speak multiple languages and want to help translate Soholaunch, you can go to that site, sign up for a free account, and start translating immediately.<br />
<br />
At any time you can download the latest language file for a given language. Here's how...<br />
# Go to http://translate.soholaunch.com<br />
# Sign-up/Log-in<br />
# Set language to the language you want to download (e.g., Hebrew)<br />
# Click link at top-left to download latest translation files<br />
<br />
Once you have downloaded the latest language file you can add it to your Soholaunch-powered website by logging-in via FTP, and uploading the hebrew.php (or spanish.php, or whatever.php) file you downloaded to this folder...<br />
public_html/sohoadmin/language<br />
<br />
==Make text scroll like a marquee==<br />
The old Text Editor (< v4.9.3) used to include a "marquee" feature that would allow you to make any block of text scroll across the page. It was absent in the updated version of the Text Editor (v4.9.3) --- and was left out because it was buggy and was more trouble than it seemed worth.<br />
<br />
However, you can still make text scroll like that by switching to HTML View and putting <marquee> tags around the part you want to scroll, like this...<br />
<br />
<marquee>scroll me</marquee><br />
<br />
[http://www.quackit.com/html/codes/html_marquee_code.cfm Check out this website I found for more on the marquee tag and how you can configure it (e.g., speed, etc).]<br />
<br />
==Put some HTML on a page as a custom code==<br />
Sometimes you try to paste some code in the Soholaunch Text Editor and you can't get it to work right. This typically happens with code that people copy-paste from other providers (like PayPal button code). In most of these cases the Text Editor in soho is trying to interpret the code so you can see what it's output looks like, but if there's javascript in there or something it can through the editor off (because it tries to execute the javascript when it gets to it...with all kinds of quirky results).<br />
<br />
Anyhow, you can avoid all these problems by putting your special code in a custom include and dropping it on your page via the Custom Code object. Any code dropped on the page via the Custom Code object is not interpreted until the page itself is loaded by the site visitor.<br />
<br />
This fixes 99.9% of all "I put the code in the Text Editor but it doesn't work." problems.<br />
<br />
# Go to edit the page where you would like to place the custom HTML.<br />
# Drag & Drop the Custom code item onto the page from the menu.<br />
# Select New file and enter a name for the embed.<br />
# Click Create New File.<br />
# Paste in the HTML.<br />
# Click Save.<br />
# Select the file from the dropdown.<br />
# Click OK.<br />
# Save page<br />
<br />
===Alternate method, create your own #variables# for your custom code===<br />
Sometimes you need custom code to display nested within content that you create using the Text Editor. For example, let's say you have a table with two columns and you want to put normal text in one column and Google ads in the other column.<br />
<br />
For this scenario, using the above method (the Custom Code drag-and-drop object) is less than ideal because you can't get precise placement using the Custom Code method (unless you include the whole table in your custom code, but that's for people who know HTML).<br />
<br />
So with this alternate method, instead of placing the custom html directly on the page, you're going to place a custom placeholder variable where you want the custom code to appear, and then use the [http://wiki.soholaunch.com/index.php?title=UDT_CONTENT_SEARCH_REPLACE UDT_CONTENT_SEARCH_REPLACE] table to replace that placeholder with the actual code when the page loads for the site visitor.<br />
<br />
Here are the steps to follow...<br />
# In the Text Editor place something the text "#mycodewillgohere#" (without the quotes) where you want the custom code to show up. This is going to be your placeholder variable. You can use whatever text you want. For example, it could be #emilyscoolvariable#...it doesn't matter, as long as it's not one of the [http://wiki.soholaunch.com/index.php?title=Custom_Template_Reference#Pound_Variables reserved variables].<br />
# Press the Update button in the Text Editor to apply your changes<br />
# Press the Save Page button.<br />
# Go to the Main Menu<br />
# Click Database Tables<br />
# Under User Tables, View/Edit Records in the UDT_CONTENT_SEARCH_REPLACE table.<br />
# Press the Add New Record button<br />
# For the "Search For" field, enter your placeholder variable (e.g., #mycodewillgohere# or #emilyscoolvariable#)<br />
# For the "Replace With" field, paste in your custom code.<br />
# Save Record.<br />
# View website. Your code should work when the is viewed, but remain as a #variable# while you're editing the page.<br />
<br />
The bonus of this method is that you can now use that #mycodewillgohere# variable ANYWHERE on your website, as many times as you want (instead of having to frequently copy-paste your custom code everywhere, you can just type that variable name).<br />
<br />
==Get started with FTP==<br />
FTP (File Transfer Protocol) is like Windows Explorer for your website's files. Often, especially when you start tinkering with your template html and css, you'll need a way to access files that the Soholaunch tool itself doesn't provide you direct access to....a way to get behind the curtain a little. This is what FTP is for.<br />
<br />
One of the better FTP clients out there is also free. It's called FileZilla. You can download it here...<br />
http://filezilla-project.org/<br />
<br />
In order to get at your template folder...<br />
# Go download filezilla (http://filezilla-project.org/)<br />
# Install it on your computer<br />
# At the top you'll see fields for host, username, and password. For "host" just fill-in your domain name (e.g., example.com). You username and password are typically the same as your cpanel usename and password. If you can't get the right username/password, check the welcome email from your web hosting company. If you can't find that, contact your web hosting company and ask them for you ftp username/password <br />
# Once you're in through ftp, [http://wiki.soholaunch.com/index.php?title=How_to#Find_your_template_folder locate your template folder]<br />
# The two files you are probably looking for are index.html and custom.css. See: [http://wiki.soholaunch.com/index.php?title=Custom_Template_Reference#Template_folder_and_files Template Folder and Files]<br />
# Download the file you want to modify to your PC, make your changes, then upload it back to your site...all though this FileZilla FTP program.<br />
<br />
==Modify your custom.css file==<br />
Most templates --- including all factory templates and most templates available on the [[http://addons.soholaunch.com|Soholaunch Addons]] website --- make use of a file called custom.css. This file contains all (or mostly all) of the styles that affect how your template looks and feels.<br />
<br />
If you want to make color, style, etc changes to your template, chances are what you are looking for is located in your template's custom.css file.<br />
<br />
You can find this file in your template folder.<br />
<br />
==Move your site to a different server==<br />
# Sign-up for new hosting account<br />
# Get temporary access url from your new web hosting company<br />
# Use temporary url to install Soholaunch to new hosting space (via Fantastico or our installsoholaunch.php script)<br />
# Back on your OLD server, log-in to sohoadmin. <br />
# Go to the Webmaster menu.<br />
# Click the Site Mover tool<br />
# Click Move this Site<br />
# Download that file it creates<br />
# On your NEW server, log-in to sohoadmin.<br />
# Go to Webmaster Menu.<br />
# Click Site Mover tool<br />
# Upload your transfer file<br />
# At your domain registrar, re-point your domain name<br />
<br />
==Add a custom redirect to a page==<br />
Here is the code to do a proper (search engine-friendly) redirect. Put this php code in a file, call it "whatever.php", and drop it on the page you want to redirect via the Custom Code object in the Page Editor.<br />
<br />
Make sure to change that "redirectohere.example.com" address.<br />
<br />
<?php<br />
header("HTTP/1.1 301 Moved Permanently");<br />
header("location: http://redirectohere.example.com");<br />
exit;<br />
?><br />
<br />
==Maximize the admin/editing window in Internet Explorer==<br />
The sohoadmin window is designed to run in a fixed size of a little smaller than 800x600 dimensions to make sure it fits on all monitor resolutions.<br />
<br />
However, sometimes it can be handy to be able to make the admin window larger if you have enough screen real-estate to do so. If you are using a browser besides Internet Explorer, like Mozilla FireFox (our recommended browser), then you can simply drag the bottom-right corner of your browser window to resize it. <br />
<br />
But if you're using Internet Explorer then follow these steps...<br />
<br />
1. Log-in to sohoadmin<br />
<br />
2. Close the sohoadmin window after it launches<br />
<br />
3. You should be looking at the "Click here to re-launch admin window" screen.<br />
<br />
4. In the address bar you'll see a URL like this...<br />
http://example.com/sohoadmin/index.php<br />
<br />
5. Change it to this...<br />
http://example.com/sohoadmin/version.php<br />
<br />
6. Hit the Enter key<br />
<br />
7. Admin window will re-launch and be resizeable<br />
<br />
==Add fonts to the new Text Editor==<br />
===CIA Fonts will not work with v4.9.2+===<br />
In versions prior to v4.9.2 there was a plugin called CIA Fonts on the Soholaunch Addons website that made it easy to add fonts to the Text Editor. But as of v4.9.2 this plugin will no longer work (until it is updated...hint, hint Thomas), because v4.9.2+ builds incorporate a completely different text editor. <br />
<br />
===The new workaround method for sites running v4.9.2+===<br />
Until an easier solution is created (which should happen before too long), you can still add fonts to the new editor, but not quite as easily as you could with the old editor and CIA Fonts. <br />
<br />
Here's how to add fonts to the new Text Editor<br />
<br />
;Note: You '''must be running''' at least '''v4.9.2 r7+''' to add fonts using this method...'''<br />
#Go to Database Table Manager<br />
#Click the "System tables" tab<br />
#Find the '''smt_userdata''' table<br />
#Click View/Edit Records<br />
#Using the search box at the top left run a search on "customfonts" (without the qoutes). Only one record should be returned.<br />
#Edit that record<br />
#Add fonts to that "data" field (details below) and hit the Save Changed Data button<br />
<br />
====Format of fonts list====<br />
The "data" field contains a list of all the fonts available in the Text Editor. You may want to copy-paste the content of the data field into a text/code editor like Dreamweaver or MS Notepad so you can see them all on one line instead of wrapped into multiple lines. Then when you're done editing the list just copy-paste it back into the text field you took it out of and save the record.<br />
<br />
''Example content of "data" field in "customfonts" record...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif<br />
<br />
The font choices are separated by semicolon ";". Each font choice has two parts, separated by an equals sign (=). The first part (e.g., Arial) is the font name as it will display in the Text Editor and doesn't matter (i.e., you could call it "Billyfont". The second part is what actually affects what font will show on the website --- the proper font-family syntax for the html/css code. Some fonts in the second part specify multiple comma-separated fonts --- these are alternates to use if the preceding font isn't available.<br />
<br />
Adding "Trebuchet" to the font list...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;Trebuchet=Trebuchet MS,verdana,arial,sans-serif<br />
<br />
Again, the display name doesn't really matter, and the multiple comma-separated alternative fonts are note required either, so could just have...<br />
Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;MyFavoriteFont=Trebuchet MS<br />
<br />
When you're done editing the font list in the data field just hit the Save Changed Data to update the record and you're done! Your new font will be available in the Text Editor now.<br />
<br />
==Find out what version of Soholaunch you're running==<br />
[[Image:Howto_find_your_version_no.gif]]<br />
<br />
The installed version number is located in the bottom-right of the admin tool window, in the footer.<br />
<br />
==Create an auto-reply email address field in the Web Form builder==<br />
In the form builder...<br />
<br />
#Click the "(+) Add Field" button<br />
#Click the "Email Address" field<br />
<br />
==Uninstall Soholaunch manually==<br />
Note: This will kill the entire website. Do not do this unless you're positive this is what you want to do. This is meant for people who installed Soholaunch manually (i.e. via installsoholaunch.php) on a website they don't want it on and now want to uninstall it.<br />
<br />
Using your preferred code editor (MS Notepad will work if you don't have a code editor of choice), create a new file (save it as deleteitall.php or something) containing this code....<br />
<pre><br />
<?<br />
shell_exec("rm -rf media");<br />
shell_exec("rm -rf images");<br />
shell_exec("rm -rf import");<br />
shell_exec("rm -rf tCustom");<br />
shell_exec("rm -rf template");<br />
shell_exec("rm -rf shopping");<br />
shell_exec("rm -rf sohoadmin");<br />
echo "Done! It's all gone!";<br />
?><br />
</pre><br />
<br />
...now save that file as something like "deleteitall.php", upload it to your document root folder (i.e. public_html, htdocs, etc.) via FTP and point your browser to websiteyouwantokill.com/deleteitall.php.<br />
<br />
==Offer your customers your own template collection==<br />
To make your custom templates available to every user on your server, wrap them all up in a zip file and upload them somewhere...it can be anywhere, as long as it's accessible from the internet.<br />
<br />
For example, let's say you upload your .zip file full of templates to...<br />
ourmaincompanywebsite.com/soho/our_templates.zip<br />
<br />
Then log-in to the Partner Area and go to "Branding Controls". Under "Templates" check the "My own templates" box, for the "URL path to template library .zip..." field fill-in<br />
http://ourmaincompanywebsite.com/soho/our_templates.zip<br />
<br />
Then scroll down and hit the "Save Options" button. Done! From now on whenever a new Soholaunch-powered website is set up on your server(s), your template library will be downloaded and installed automatically.<br />
<br />
==Rename/Delete a page that won't delete==<br />
Usually, if you can't delete a page it's because it has some trouble characters in its name like an ampersand (&) or something. In order to delete the page you'll have to rename it first. And you'll have to rename it "the hard way" because that ampersand won't let you rename it "the easy way" (via Page Properties) for the same reason it won't let you delete the page.<br />
<br />
So here's the step by step for manually renaming a page called "Milo & Otis" to "Milo and Otis" so it won't give you any more problems.<br />
#Go to Main Menu > Database Table Manager<br />
#Select the site_pages table from the drop-down menu<br />
#Hit the "Enter/Edit Record Data" button<br />
#When the table pulls up click the link on the top right that says "Run custom query"<br />
#Put the following tn the text box that pops-up and hit the "Run Query" button...<br />
update site_pages set page_name = 'Milo and Otis' where page_name = 'Milo & Otis'<br />
<br />
Once you follow these steps you should be able to delete, rename, etc the page as normal.<br />
<br />
==Find/Edit custom table search includes==<br />
Via FTP, the files are located here...<br />
[public_html]/media<br />
<br />
File naming convention...<br />
udt-search_[search name].inc<br />
<br />
Example file name...<br />
udt-search_joes_cool_search.inc<br />
<br />
You can download these files to your PC, modify them, then upload them back to that /media folder and you're good to go.<br />
<br />
==Link to specific shopping cart sku==<br />
Go to your website and browse your shopping cart. Click the Buy Now/More Information link for the product you want to link to, then copy the url from your address bar. Should look something like this...<br />
<br />
http://provx.soholaunch.com/shopping/pgm-more_information.php?id=1<br />
<br />
Advanced Note: That id # matches the prikey value of that sku in the cart_products table.<br />
<br />
==Link to specific shopping cart category==<br />
Go to your website and browse your shopping cart. In the search column you'll see a list of links to your categories (in the search column). Click on the link to the category you want, then copy the url from your address bar. Should look something like this...<br />
<br />
http://yourdomain.com/shopping/start.php?browse=1&cat=25<br />
<br />
==Link to specific month/year in you event calendar==<br />
In the text editor, select the text you want to link and hit the little link icon/button next to the paint bucket. Then in the link dialog that pops up, in the field that says "(or) Link / Anchor:" and has "http://" already in the field, do this...<br />
<br />
http://yourdomain.com/About_Us.php?SEL_MONTH=04&SEL_YEAR=2007<br />
<br />
Note: Replace "About_Us" with the name of the page that you dropped you're calendar on, and replace the month and year numbers with whatever month/year you want to jump to.<br />
<br />
==Reset your hit counter==<br />
#Log-in to your site via FTP<br />
#Browse to the "sohoadmin/filebin/" folder<br />
#Delete hitcounter.txt<br />
<br />
==Move license from subdomain to primary domain==<br />
#Log-in to the partner area<br />
#Click on "Lifetime Licenses"<br />
#Delete the license listed for your subdomain<br />
#Click "Add Domain"<br />
#Fill-in the name of your primary domain and click "Generate License"<br />
<br />
==Download page content files==<br />
Via FTP, the files are located here...<br />
[public_html]/sohoadmin/tmp_content<br />
<br />
===What's the difference between CON and REGEN files?===<br />
In short, CON files are for the website-side, REGEN files are for the admin-side. <br />
<br />
;CON files: When a visitor views a page on your website, script files read the CON file for that page and use it to build the final HTML for the page. CON files tell the website-side scripts that you've got a cart item, a login box, and this text on this page.<br />
<br />
;REGEN files: These are used by Soholaunch's Page Editor. When you open a page in Soholaunch to edit it, the REGEN file for that page is read and it tells the product what objects are on the page and which dropzones to display them in.<br />
<br />
When you save a page in the Page Editor, it saves a REGEN file for that page so it knows what edit options to show you in the Page Editor the next time you edit that page, and then it builds a CON file for the page so that the website-side scripts know what to display to site visitors.<br />
<br />
==Upload video files via FTP==<br />
Via FTP, the files are located here...<br />
[public_html]/media<br />
<br />
==Find/Edit the default contact forms==<br />
'''Contact forms'''<br><br />
Via FTP, the files are located here...<br />
[public_html]/sohoadmin/program/modules/page_editor/formlib/forms<br />
<br />
The files are:<br />
*Contact_Form_(Basic).form<br />
*General_Email_Form.form<br />
<br />
'''Newsletter quick signup form'''<br><br />
The file for this is located here...<br />
[public_html]/sohoadmin/program/modules/page_editor/formlib/newsletter/Quick-N-Easy_Signup.form<br />
<br />
'''Points to remember:'''<br />
*Though they're technicaly just html files, make sure to preserve the .form extension when you upload them back to your site so the system can recognize them (which is the whole idea behind the .form extension --- so know it's a form).<br />
<br />
==Find your template folder==<br />
'''1. Log-in via FTP to your website and navigate to this folder...'''<br />
public_html/sohoadmin/program/modules/site_templates/pages/<br />
<br />
'''2. Find the folder for your specific template.'''<br />
This is the naming convention for template folders..<br />
CATEGORY-Template_Name-Color<br />
<br />
So if you're using CORPORATE > A_Curvacious_Mark (Blue), your template folder would be...<br />
CORPORATE-A_Curvacious_Mark-Blue<br />
<br />
...and the full path from your home directory would be:<br />
public_html/sohoadmin/program/modules/site_templates/pages/CORPORATE-A_Curvacious_Mark-Blue<br />
<br />
==Swap out your template header text for a logo image==<br />
1. Download the '''index.html''' file from your [[#Find your template folder|template folder]]<br />
<br />
2. Find (ctrl+f) '''"#LOGO#"'''<br />
<br />
3. Replace it with '''"#LOGOIMG#"'''<br />
<br />
4. Save the file and upload it back to your template folder<br />
<br />
You can now add and change the logo image in your template via Template Manager (where it says choose logo image). <br />
<br />
The same logic applies if you want to change your logo text to something else or add other information right around it. For example, if your template allows for header text via #LOGO# and you want slogan text too, you could find that #LOGO# in your template's .html file but instead of replacing it with #LOGOIMG# you could change it to something like...<br />
<br />
'''Example: Apply same logic to add slogan text'''<br />
<br />
''Original line in template's index.html file...''<br />
#LOGO#<br />
<br />
''Add a line break and the pound-variable for slogan text...''<br />
#LOGO#<br>#SLOGAN#<br />
<br />
Complete list of available pound variables like #LOGO#, #LOGOIMG#, and #SLOGAN#, see [[Custom_Template_Reference|custom template reference]].<br />
<br />
==Set background image==<br />
1. '''Log-in via FTP and find your template's folder...'''<br />
<br />
2. '''Upload the image you want to use''' as your background to that folder<br />
<br />
3. '''Download the custom.css file''' that's in there and open it up in your code editor of choice (or notepad will work if nothing else)<br />
<br />
4. '''Add in this code...'''<br />
body { background-image: url(mybackgroundimage.gif); }<br />
<br />
5. '''Save the file (custom.css)''' and upload it back to your template's folder<br />
<br />
==Make a button that links to another website, but opens that link in a new window==<br />
<br />
'''Solution:''' Pull up the Text Editor where you put in the button, click on the "HTML" button at the bottom left. <br />
<br />
The HTML for your button should look something like this...<br />
<pre><input type="button" style="width: 163px; color: <br />
rgb(29, 0, 237); height: 24px; background-color: rgb(249, 186, 0);"<br />
size="217" value="Click here to go to example.com"></pre><br />
<br />
To make this button link to "www.example.com", insert the following "onclick" attribute...<br />
<pre>onclick="window.open('http://www.example.com','', <br />
'width=800px,height=600px,resizable');"</pre><br />
<br />
So the full code for the button should look something like...<br />
<pre><input type="button" onclick="window.open('http://www.example.com','',<br />
'width=800px, height=600px,resizable');"<br />
style="width: 163px; color: rgb(29, 0, 237); <br />
height: 24px; background-color: rgb(249, 186, 0);" <br />
size="217" value="My Button"></pre><br />
<br />
Just replace "www.example.com" with the site you want to link to, and you're good to go.<br />
<br />
==Install Soholaunch on a subdomain manually via cPanel==<br />
How to install manually on subdomain....<br />
<br />
http://soholaunch.com<br />
# Download installer<br />
<br />
cPanel<br />
# Create database<br />
# Create user<br />
# Add user to database<br />
<br />
Local PC<br />
# Extract installsoholaunch.zip somewhere<br />
<br />
FTP Client<br />
# Upload installsoholaunch.php to root of subfolder for subdomain (e.g., "public_html/fr" for "fr.domain.com")<br />
<br />
Browser<br />
# Go to yourdomain.com/installsoholaunch.php<br />
# Click install button<br />
# Fill-out setup form with database info (db name, username, password you just created in cPanel)<br />
# Done installing!<br />
<br />
==Import a large number of shopping cart items at once==<br />
# Log-in to sohoadmin (yourdomain.com/sohoadmin)<br />
# Main Menu > Database Tables > System Tables tab<br />
# Scroll until you see the "cart_products" table. If it does not exist, return to the Main Menu and click the Shopping Cart icon once, wait for the Shopping Cart menu to load (the one with buttons that say things like Shipping Options, Find/Edit Products, Tax Options, etc), and then go back to Database Tables > System Tables (so basically start over at step #2 above).<br />
# Next to the "cart_products" name you'll see a Download link. Click that to download the table in CSV format.<br />
# Open Microsoft Excel, create a new spreadsheet<br />
# In Excel, do this: Data > Import External Data > (select the file you downloaded) > Semicolon delimited > Finish<br />
# Now you have all the right column names set up in your spreadsheet, you can start filling it out with all your product info.<br />
# When you've got it filled out, Save As > CSV file (semicolon delimited) > Yes on the warning prompt about losing funcitonality<br />
# Back in sohoadmin, go to Main Menu > File Manager > Upload Files<br />
# Upload the .csv file you just saved your spreadsheet to.<br />
# Go back to sohoadmin > Main Menu > Database Tables > System tables tab<br />
# Next to cart_products, click the Import link. <br />
# Select the CSV file you uploaded, then follow the prompts to make sure that your column names match up.<br />
# Once you finish the Import action, you're all done!<br />
<br />
'''Note1:''' If you already have a spreadsheet full of shopping cart items, skip to step 8<br />
<br />
'''Note2:''' The PROD_CATEGORY fields use the keyfield numbers from the cart_category table, which you can also view via Database Tables > System Tables tab > View/Edit Records<br />
<br />
'''Note3:''' You can also use this import feature to ''update'' many cart items at one time.<br />
<br />
'''Note4:''' Always use the Backup/Restore to make a backup first!<br />
<br />
==Transfer shopping cart items from one site to another==<br />
<br />
sohoadmin for Main site (e.g, yourdomain.com)<br />
# Database Tables feature<br />
# System Tables<br />
# cart_products<br />
# Click the download link<br />
# Save that somewhere on your PC<br />
<br />
sohoadmin for subdomain (e.g., fr.yourdomain.com)<br />
# File Manager<br />
# Upload Files<br />
# Upload csv file that you downloaded<br />
# Database Tables<br />
# System Tables<br />
# cart_products<br />
# Import<br />
# Follow instructions<br />
<br />
==Make blog sort by earliest-to-latest, instead of latest-to-earliest.==<br />
1. Log-in via FTP, browse to your public_html folder<br />
<br />
2. Download pgm-blog_display.php<br />
<br />
3. Modify sort order by finding this line...<br />
$blog_qry = "ORDER BY timestamp DESC, PRIKEY DESC LIMIT 15"; // Limit by 15<br />
<br />
to this...<br />
$blog_qry = "ORDER BY timestamp DESC, PRIKEY ASC LIMIT 15"; // Limit by 15<br />
<br />
4. To be safe, find all other instances of "DESC" and replace them with "ASC".<br />
<br />
5. Save. Upload your modified pgm-blog_display.php TO YOUR TEMPLATE FOLDER. If Soholaunch finds a pgm-blog_display.php in your template folder, it will use it instead of the standard file.<br />
<br />
==Enable pre-release testing builds==<br />
Sometimes we will release small version updates to address specific problems on client websites (or to test new features). You can think of these builds as "nightly" or "beta" builds. They come with no guarantees about reliability, and you should not update to them unless you are installing on a development site, or unless a member of the Soholaunch support staff tells you to update to it.<br />
<br />
By default, you cannot see these beta builds in the Software Updates feature. You need to enable them. Here's how to do that...<br />
# From your sohoadmin control panel, go here: Main Menu > Webmaster > Software Updates<br />
# Click the link that looks like this: "[?] Technical diagnostic info (for geeks)"<br />
# This will open a popup layer. Look at the bottom of the popup.<br />
# Set this option to "Yes/Enabled": "Enable pre-release testing builds"<br />
# Close popup and click the Check For Updates button again<br />
# You should see the beta build listed as available to install (note a beta build is not always available).<br />
<br />
==Create a database with cPanel==<br />
All Soholaunch installations require a database, along with an associated database user/pass. Here's how to create a MySQL database and assign a user to it using cPanel.<br />
<br />
===Step 1: Create the Database===<br />
# Log-in to cPanel (yourdomain.com/cpanel)<br />
# Find the icon for MySQL Databases. Click it.<br />
# Under the Create New Database heading, fill in a name in the text field (note that usually every database is prefixed with your cPanel username, which is shown before the text field). Usually, I just type in "soho" for the database name, making the full database name "[username]_soho"<br />
# Click the Create New Database button.<br />
# Now your database is created.<br />
<br />
===Step 2: Create a User===<br />
Now you need to create a user/pass for the database.<br />
# Still on the MySQL Databases page, scroll down under Add New User.<br />
# Fill in a name. This is like the database name. You're only going to use it once and you won't need to remember it for more than the next 5 minutes. Keep it short and use letters only.<br />
# Note: Like the database name, the username is prefixed is by your cPanel username.<br />
# For the password, just use the password generator and copy it down somewhere temporary. Again, you will only need this password for the next 5 minutes of your life.<br />
# Click the Create User button.<br />
<br />
===Assign the user to the database===<br />
*Why this is necessary:* In case you're curious as to why we have to do this: All you've done so far is create a user for the database. Right now, this user has no authority. He's just an empty shell of a user, lonely and without a database to work on. You need to associate this new user with the database.<br />
<br />
# Scroll down to the Add User to Database section (underneath where you created the user).<br />
# Select the name of the user you just created from the first dropdown.<br />
# Select the name of the database you created in Step 1 from the second dropdown.<br />
# Click the Add button<br />
# Check the box for All Privileges<br />
# Click the Add button<br />
# All done!</div>Sohohttps://wiki.soholaunch.com/index.php?title=Creating_a_basic_pluginCreating a basic plugin2013-10-17T23:19:13Z<p>Soho: /* Introduction */</p>
<hr />
<div>==Introduction==<br />
This tutorial will walk you through the creation of a basic plugin that opens a javascript alert box with the text "Hello World" in it on every page of your website (annoying, I know, but at least you'll know it's working).<br />
<br />
'''[http://soholaunch.com/media/hello-world.zip Download the example plugin]'''<br />
<br />
'''You'll need...'''<br />
#A website with Soholaunch (Pro or Ultra) installed on it.<br />
#Your favorite code editor (for php)<br />
#Comfort editing basic php code<br />
#Some comfort with Soholaunch's file structure will help, but is not essential.<br />
#FTP access to your website<br />
<br />
==Create a folder for your plugin==<br />
Create a folder on your computer called ''hello-world''. All of your plugin's files will go in this folder.<br />
<br />
==Find the hook you want to attach your custom file to==<br />
Open Your FTP client and log-in to your test site. For this example, we're going to add code to your soho-created website's html. The file below builds the website's html...<br />
<pre>public_html/sohoadmin/client_files/pgm-realtime_builder.php</pre><br />
<br />
Open that file, and scroll all the way to the bottom. You'll see this line...<br />
<pre># Add stuff to final html<br />
eval(hook("pgm-realtime_builder.php:add-to-final-html"));</pre><br />
<br />
That's what a hook looks like in the Soholaunch source code. This is where your file will be included. The text inside the hook() function call (pgm-realtime_builder.php:add-to-final-html) is the hook id that you need for your plugin's install_manifest.php file.<br />
<br />
==Create your include file==<br />
In your ''hello-world'' folder, create a file called ''hello-world.php'' (note: actual filename doesn't matter). This file will contain add a javascript alert to the ''$template_footer'' variable's contents. The ''$template_footer'' variable contains all of the website html from the page content downward (so all content that gets swapped-in for #content#, as well as the template html that follows #content# in the template file).<br />
<br />
Contents of hello-world.php...<br />
<pre><?php<br />
$template_footer .= '<script>alert("Hello, World.");</script>';<br />
?></pre><br />
<br />
==Create an install_manifest.php for your plugin==<br />
The ''install_manifest.php'' is the configuration file for your plugin. Every Soholaunch plugin has an ''install_manifest.php''. This file is read by Soholaunch when the user installs the plugin. It tells Soholaunch how to display your plugin (title, author, etc), and where to hook its files into.<br />
<br />
There are two types of content in any given ''install_manifest.php'':<br />
#'''Information''' - plugin title, author, etc<br />
#'''Instructions''' - "hook me in here, here, and here"<br />
<br />
Here's what our install_manifest.php is going to look like...<br />
<pre><?php<br />
# This should match your plugin's folder name<br />
$plugin_folder = "hello-world";<br />
<br />
# These are just for display to the user, you can define them however you see fit (html allowed)<br />
$plugin_title = "Hello World";<br />
$plugin_version = "2.0";<br />
$plugin_author = "Soholaunch.com, Inc.";<br />
$plugin_homepage = "http://example.com";<br />
$plugin_description = "Adds drag and drop 'Hello World' item to the Page Editor";<br />
<br />
/* Include my hello-world.php file at *this* location (specified by hook id found in the Soholaunch source code) */<br />
hook_attach("hello-world.php", "pgm-realtime_builder.php:add-to-final-html");<br />
?></pre><br />
<br />
====Optional: Plugin icon====<br />
If you'd like your plugin to have it's own icon displayed next to it's name in the Plugin Manager (instead of the default puzzle piece graphic), include the image file in your plugin folder, and add a line like this to your install_manifest.php...<br />
$plugin_icon = "my_plugin_icon.gif"<br />
<br />
==Recap: This is what your plugin folder should look like==<br />
At this point your plugin is essentially done.<br />
<br />
Your plugin folder should look like this now...<br />
<br />
<pre>hello-world/<br />
install_manifest.php<br />
main_menu-helloworld.php</pre><br />
<br />
Using winzip, winrar, or other similar archive app, zip-up your ''hello-world'' folder (the folder itself, not just the contents). In Windows, you'd right-click on the ''hello-world'' folder and click "Add to archive..."<br />
<br />
For purposes of example, name your .zip file *hello-world.zip*<br />
<br />
==You're ready==<br />
Your plugin is finished and ready to rock. Log-in to ''/sohoadmin'' and upload/install your hello-world.zip via the Plugin Manager.<br />
<br />
Then view your website, and you should see the "Hello, World" javascript alert.<br />
<br />
[[Category:Plugins]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Creating_a_basic_pluginCreating a basic plugin2013-10-17T23:19:03Z<p>Soho: /* Introduction */</p>
<hr />
<div>==Introduction==<br />
This tutorial will walk you through the creation of a basic plugin that opens a javascript alert box with the text "Hello World" in it on every page of your website (annoying, I know, but at least you'll know it's working).<br />
<br />
'''[http://soholaunch.com/media/hello-world.zip download the example plugin]'''<br />
<br />
'''You'll need...'''<br />
#A website with Soholaunch (Pro or Ultra) installed on it.<br />
#Your favorite code editor (for php)<br />
#Comfort editing basic php code<br />
#Some comfort with Soholaunch's file structure will help, but is not essential.<br />
#FTP access to your website<br />
<br />
==Create a folder for your plugin==<br />
Create a folder on your computer called ''hello-world''. All of your plugin's files will go in this folder.<br />
<br />
==Find the hook you want to attach your custom file to==<br />
Open Your FTP client and log-in to your test site. For this example, we're going to add code to your soho-created website's html. The file below builds the website's html...<br />
<pre>public_html/sohoadmin/client_files/pgm-realtime_builder.php</pre><br />
<br />
Open that file, and scroll all the way to the bottom. You'll see this line...<br />
<pre># Add stuff to final html<br />
eval(hook("pgm-realtime_builder.php:add-to-final-html"));</pre><br />
<br />
That's what a hook looks like in the Soholaunch source code. This is where your file will be included. The text inside the hook() function call (pgm-realtime_builder.php:add-to-final-html) is the hook id that you need for your plugin's install_manifest.php file.<br />
<br />
==Create your include file==<br />
In your ''hello-world'' folder, create a file called ''hello-world.php'' (note: actual filename doesn't matter). This file will contain add a javascript alert to the ''$template_footer'' variable's contents. The ''$template_footer'' variable contains all of the website html from the page content downward (so all content that gets swapped-in for #content#, as well as the template html that follows #content# in the template file).<br />
<br />
Contents of hello-world.php...<br />
<pre><?php<br />
$template_footer .= '<script>alert("Hello, World.");</script>';<br />
?></pre><br />
<br />
==Create an install_manifest.php for your plugin==<br />
The ''install_manifest.php'' is the configuration file for your plugin. Every Soholaunch plugin has an ''install_manifest.php''. This file is read by Soholaunch when the user installs the plugin. It tells Soholaunch how to display your plugin (title, author, etc), and where to hook its files into.<br />
<br />
There are two types of content in any given ''install_manifest.php'':<br />
#'''Information''' - plugin title, author, etc<br />
#'''Instructions''' - "hook me in here, here, and here"<br />
<br />
Here's what our install_manifest.php is going to look like...<br />
<pre><?php<br />
# This should match your plugin's folder name<br />
$plugin_folder = "hello-world";<br />
<br />
# These are just for display to the user, you can define them however you see fit (html allowed)<br />
$plugin_title = "Hello World";<br />
$plugin_version = "2.0";<br />
$plugin_author = "Soholaunch.com, Inc.";<br />
$plugin_homepage = "http://example.com";<br />
$plugin_description = "Adds drag and drop 'Hello World' item to the Page Editor";<br />
<br />
/* Include my hello-world.php file at *this* location (specified by hook id found in the Soholaunch source code) */<br />
hook_attach("hello-world.php", "pgm-realtime_builder.php:add-to-final-html");<br />
?></pre><br />
<br />
====Optional: Plugin icon====<br />
If you'd like your plugin to have it's own icon displayed next to it's name in the Plugin Manager (instead of the default puzzle piece graphic), include the image file in your plugin folder, and add a line like this to your install_manifest.php...<br />
$plugin_icon = "my_plugin_icon.gif"<br />
<br />
==Recap: This is what your plugin folder should look like==<br />
At this point your plugin is essentially done.<br />
<br />
Your plugin folder should look like this now...<br />
<br />
<pre>hello-world/<br />
install_manifest.php<br />
main_menu-helloworld.php</pre><br />
<br />
Using winzip, winrar, or other similar archive app, zip-up your ''hello-world'' folder (the folder itself, not just the contents). In Windows, you'd right-click on the ''hello-world'' folder and click "Add to archive..."<br />
<br />
For purposes of example, name your .zip file *hello-world.zip*<br />
<br />
==You're ready==<br />
Your plugin is finished and ready to rock. Log-in to ''/sohoadmin'' and upload/install your hello-world.zip via the Plugin Manager.<br />
<br />
Then view your website, and you should see the "Hello, World" javascript alert.<br />
<br />
[[Category:Plugins]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Creating_a_basic_pluginCreating a basic plugin2013-10-17T23:18:38Z<p>Soho: /* Introduction */</p>
<hr />
<div>==Introduction==<br />
This tutorial will walk you through the creation of a basic plugin that opens a javascript alert box with the text "Hello World" in it on every page of your website (annoying, I know, but at least you'll know it's working).<br />
<br />
'''Download the example plugin:''' [http://soholaunch.com/media/hello-world.zip download the example plugin]<br />
<br />
'''You'll need...'''<br />
#A website with Soholaunch (Pro or Ultra) installed on it.<br />
#Your favorite code editor (for php)<br />
#Comfort editing basic php code<br />
#Some comfort with Soholaunch's file structure will help, but is not essential.<br />
#FTP access to your website<br />
<br />
==Create a folder for your plugin==<br />
Create a folder on your computer called ''hello-world''. All of your plugin's files will go in this folder.<br />
<br />
==Find the hook you want to attach your custom file to==<br />
Open Your FTP client and log-in to your test site. For this example, we're going to add code to your soho-created website's html. The file below builds the website's html...<br />
<pre>public_html/sohoadmin/client_files/pgm-realtime_builder.php</pre><br />
<br />
Open that file, and scroll all the way to the bottom. You'll see this line...<br />
<pre># Add stuff to final html<br />
eval(hook("pgm-realtime_builder.php:add-to-final-html"));</pre><br />
<br />
That's what a hook looks like in the Soholaunch source code. This is where your file will be included. The text inside the hook() function call (pgm-realtime_builder.php:add-to-final-html) is the hook id that you need for your plugin's install_manifest.php file.<br />
<br />
==Create your include file==<br />
In your ''hello-world'' folder, create a file called ''hello-world.php'' (note: actual filename doesn't matter). This file will contain add a javascript alert to the ''$template_footer'' variable's contents. The ''$template_footer'' variable contains all of the website html from the page content downward (so all content that gets swapped-in for #content#, as well as the template html that follows #content# in the template file).<br />
<br />
Contents of hello-world.php...<br />
<pre><?php<br />
$template_footer .= '<script>alert("Hello, World.");</script>';<br />
?></pre><br />
<br />
==Create an install_manifest.php for your plugin==<br />
The ''install_manifest.php'' is the configuration file for your plugin. Every Soholaunch plugin has an ''install_manifest.php''. This file is read by Soholaunch when the user installs the plugin. It tells Soholaunch how to display your plugin (title, author, etc), and where to hook its files into.<br />
<br />
There are two types of content in any given ''install_manifest.php'':<br />
#'''Information''' - plugin title, author, etc<br />
#'''Instructions''' - "hook me in here, here, and here"<br />
<br />
Here's what our install_manifest.php is going to look like...<br />
<pre><?php<br />
# This should match your plugin's folder name<br />
$plugin_folder = "hello-world";<br />
<br />
# These are just for display to the user, you can define them however you see fit (html allowed)<br />
$plugin_title = "Hello World";<br />
$plugin_version = "2.0";<br />
$plugin_author = "Soholaunch.com, Inc.";<br />
$plugin_homepage = "http://example.com";<br />
$plugin_description = "Adds drag and drop 'Hello World' item to the Page Editor";<br />
<br />
/* Include my hello-world.php file at *this* location (specified by hook id found in the Soholaunch source code) */<br />
hook_attach("hello-world.php", "pgm-realtime_builder.php:add-to-final-html");<br />
?></pre><br />
<br />
====Optional: Plugin icon====<br />
If you'd like your plugin to have it's own icon displayed next to it's name in the Plugin Manager (instead of the default puzzle piece graphic), include the image file in your plugin folder, and add a line like this to your install_manifest.php...<br />
$plugin_icon = "my_plugin_icon.gif"<br />
<br />
==Recap: This is what your plugin folder should look like==<br />
At this point your plugin is essentially done.<br />
<br />
Your plugin folder should look like this now...<br />
<br />
<pre>hello-world/<br />
install_manifest.php<br />
main_menu-helloworld.php</pre><br />
<br />
Using winzip, winrar, or other similar archive app, zip-up your ''hello-world'' folder (the folder itself, not just the contents). In Windows, you'd right-click on the ''hello-world'' folder and click "Add to archive..."<br />
<br />
For purposes of example, name your .zip file *hello-world.zip*<br />
<br />
==You're ready==<br />
Your plugin is finished and ready to rock. Log-in to ''/sohoadmin'' and upload/install your hello-world.zip via the Plugin Manager.<br />
<br />
Then view your website, and you should see the "Hello, World" javascript alert.<br />
<br />
[[Category:Plugins]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Creating_a_basic_pluginCreating a basic plugin2013-10-17T23:18:23Z<p>Soho: /* Introduction */</p>
<hr />
<div>==Introduction==<br />
This tutorial will walk you through the creation of a basic plugin that opens a javascript alert box with the text "Hello World" in it on every page of your website (annoying, I know, but at least you'll know it's working).<br />
<br />
Link to *download the example plugin:* [http://soholaunch.com/media/hello-world.zip download the example plugin]<br />
<br />
'''You'll need...'''<br />
#A website with Soholaunch (Pro or Ultra) installed on it.<br />
#Your favorite code editor (for php)<br />
#Comfort editing basic php code<br />
#Some comfort with Soholaunch's file structure will help, but is not essential.<br />
#FTP access to your website<br />
<br />
==Create a folder for your plugin==<br />
Create a folder on your computer called ''hello-world''. All of your plugin's files will go in this folder.<br />
<br />
==Find the hook you want to attach your custom file to==<br />
Open Your FTP client and log-in to your test site. For this example, we're going to add code to your soho-created website's html. The file below builds the website's html...<br />
<pre>public_html/sohoadmin/client_files/pgm-realtime_builder.php</pre><br />
<br />
Open that file, and scroll all the way to the bottom. You'll see this line...<br />
<pre># Add stuff to final html<br />
eval(hook("pgm-realtime_builder.php:add-to-final-html"));</pre><br />
<br />
That's what a hook looks like in the Soholaunch source code. This is where your file will be included. The text inside the hook() function call (pgm-realtime_builder.php:add-to-final-html) is the hook id that you need for your plugin's install_manifest.php file.<br />
<br />
==Create your include file==<br />
In your ''hello-world'' folder, create a file called ''hello-world.php'' (note: actual filename doesn't matter). This file will contain add a javascript alert to the ''$template_footer'' variable's contents. The ''$template_footer'' variable contains all of the website html from the page content downward (so all content that gets swapped-in for #content#, as well as the template html that follows #content# in the template file).<br />
<br />
Contents of hello-world.php...<br />
<pre><?php<br />
$template_footer .= '<script>alert("Hello, World.");</script>';<br />
?></pre><br />
<br />
==Create an install_manifest.php for your plugin==<br />
The ''install_manifest.php'' is the configuration file for your plugin. Every Soholaunch plugin has an ''install_manifest.php''. This file is read by Soholaunch when the user installs the plugin. It tells Soholaunch how to display your plugin (title, author, etc), and where to hook its files into.<br />
<br />
There are two types of content in any given ''install_manifest.php'':<br />
#'''Information''' - plugin title, author, etc<br />
#'''Instructions''' - "hook me in here, here, and here"<br />
<br />
Here's what our install_manifest.php is going to look like...<br />
<pre><?php<br />
# This should match your plugin's folder name<br />
$plugin_folder = "hello-world";<br />
<br />
# These are just for display to the user, you can define them however you see fit (html allowed)<br />
$plugin_title = "Hello World";<br />
$plugin_version = "2.0";<br />
$plugin_author = "Soholaunch.com, Inc.";<br />
$plugin_homepage = "http://example.com";<br />
$plugin_description = "Adds drag and drop 'Hello World' item to the Page Editor";<br />
<br />
/* Include my hello-world.php file at *this* location (specified by hook id found in the Soholaunch source code) */<br />
hook_attach("hello-world.php", "pgm-realtime_builder.php:add-to-final-html");<br />
?></pre><br />
<br />
====Optional: Plugin icon====<br />
If you'd like your plugin to have it's own icon displayed next to it's name in the Plugin Manager (instead of the default puzzle piece graphic), include the image file in your plugin folder, and add a line like this to your install_manifest.php...<br />
$plugin_icon = "my_plugin_icon.gif"<br />
<br />
==Recap: This is what your plugin folder should look like==<br />
At this point your plugin is essentially done.<br />
<br />
Your plugin folder should look like this now...<br />
<br />
<pre>hello-world/<br />
install_manifest.php<br />
main_menu-helloworld.php</pre><br />
<br />
Using winzip, winrar, or other similar archive app, zip-up your ''hello-world'' folder (the folder itself, not just the contents). In Windows, you'd right-click on the ''hello-world'' folder and click "Add to archive..."<br />
<br />
For purposes of example, name your .zip file *hello-world.zip*<br />
<br />
==You're ready==<br />
Your plugin is finished and ready to rock. Log-in to ''/sohoadmin'' and upload/install your hello-world.zip via the Plugin Manager.<br />
<br />
Then view your website, and you should see the "Hello, World" javascript alert.<br />
<br />
[[Category:Plugins]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Creating_a_basic_pluginCreating a basic plugin2013-10-17T23:17:49Z<p>Soho: /* Introduction */</p>
<hr />
<div>==Introduction==<br />
This tutorial will walk you through the creation of a basic plugin that opens a javascript alert box with the text "Hello World" in it on every page of your website (annoying, I know, but at least you'll know it's working).<br />
<br />
*[http://soholaunch.com/media/hello-world.zip download the example plugin]*<br />
<br />
'''You'll need...'''<br />
#A website with Soholaunch (Pro or Ultra) installed on it.<br />
#Your favorite code editor (for php)<br />
#Comfort editing basic php code<br />
#Some comfort with Soholaunch's file structure will help, but is not essential.<br />
#FTP access to your website<br />
<br />
==Create a folder for your plugin==<br />
Create a folder on your computer called ''hello-world''. All of your plugin's files will go in this folder.<br />
<br />
==Find the hook you want to attach your custom file to==<br />
Open Your FTP client and log-in to your test site. For this example, we're going to add code to your soho-created website's html. The file below builds the website's html...<br />
<pre>public_html/sohoadmin/client_files/pgm-realtime_builder.php</pre><br />
<br />
Open that file, and scroll all the way to the bottom. You'll see this line...<br />
<pre># Add stuff to final html<br />
eval(hook("pgm-realtime_builder.php:add-to-final-html"));</pre><br />
<br />
That's what a hook looks like in the Soholaunch source code. This is where your file will be included. The text inside the hook() function call (pgm-realtime_builder.php:add-to-final-html) is the hook id that you need for your plugin's install_manifest.php file.<br />
<br />
==Create your include file==<br />
In your ''hello-world'' folder, create a file called ''hello-world.php'' (note: actual filename doesn't matter). This file will contain add a javascript alert to the ''$template_footer'' variable's contents. The ''$template_footer'' variable contains all of the website html from the page content downward (so all content that gets swapped-in for #content#, as well as the template html that follows #content# in the template file).<br />
<br />
Contents of hello-world.php...<br />
<pre><?php<br />
$template_footer .= '<script>alert("Hello, World.");</script>';<br />
?></pre><br />
<br />
==Create an install_manifest.php for your plugin==<br />
The ''install_manifest.php'' is the configuration file for your plugin. Every Soholaunch plugin has an ''install_manifest.php''. This file is read by Soholaunch when the user installs the plugin. It tells Soholaunch how to display your plugin (title, author, etc), and where to hook its files into.<br />
<br />
There are two types of content in any given ''install_manifest.php'':<br />
#'''Information''' - plugin title, author, etc<br />
#'''Instructions''' - "hook me in here, here, and here"<br />
<br />
Here's what our install_manifest.php is going to look like...<br />
<pre><?php<br />
# This should match your plugin's folder name<br />
$plugin_folder = "hello-world";<br />
<br />
# These are just for display to the user, you can define them however you see fit (html allowed)<br />
$plugin_title = "Hello World";<br />
$plugin_version = "2.0";<br />
$plugin_author = "Soholaunch.com, Inc.";<br />
$plugin_homepage = "http://example.com";<br />
$plugin_description = "Adds drag and drop 'Hello World' item to the Page Editor";<br />
<br />
/* Include my hello-world.php file at *this* location (specified by hook id found in the Soholaunch source code) */<br />
hook_attach("hello-world.php", "pgm-realtime_builder.php:add-to-final-html");<br />
?></pre><br />
<br />
====Optional: Plugin icon====<br />
If you'd like your plugin to have it's own icon displayed next to it's name in the Plugin Manager (instead of the default puzzle piece graphic), include the image file in your plugin folder, and add a line like this to your install_manifest.php...<br />
$plugin_icon = "my_plugin_icon.gif"<br />
<br />
==Recap: This is what your plugin folder should look like==<br />
At this point your plugin is essentially done.<br />
<br />
Your plugin folder should look like this now...<br />
<br />
<pre>hello-world/<br />
install_manifest.php<br />
main_menu-helloworld.php</pre><br />
<br />
Using winzip, winrar, or other similar archive app, zip-up your ''hello-world'' folder (the folder itself, not just the contents). In Windows, you'd right-click on the ''hello-world'' folder and click "Add to archive..."<br />
<br />
For purposes of example, name your .zip file *hello-world.zip*<br />
<br />
==You're ready==<br />
Your plugin is finished and ready to rock. Log-in to ''/sohoadmin'' and upload/install your hello-world.zip via the Plugin Manager.<br />
<br />
Then view your website, and you should see the "Hello, World" javascript alert.<br />
<br />
[[Category:Plugins]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Creating_a_basic_pluginCreating a basic plugin2013-10-17T23:03:17Z<p>Soho: </p>
<hr />
<div>==Introduction==<br />
This tutorial will walk you through the creation of a basic plugin that opens a javascript alert box with the text "Hello World" in it on every page of your website (annoying, I know, but at least you'll know it's working).<br />
<br />
'''You'll need...'''<br />
#A website with Soholaunch (Pro or Ultra) installed on it.<br />
#Your favorite code editor (for php)<br />
#Comfort editing basic php code<br />
#Some comfort with Soholaunch's file structure will help, but is not essential.<br />
#FTP access to your website<br />
<br />
==Create a folder for your plugin==<br />
Create a folder on your computer called ''hello-world''. All of your plugin's files will go in this folder.<br />
<br />
==Find the hook you want to attach your custom file to==<br />
Open Your FTP client and log-in to your test site. For this example, we're going to add code to your soho-created website's html. The file below builds the website's html...<br />
<pre>public_html/sohoadmin/client_files/pgm-realtime_builder.php</pre><br />
<br />
Open that file, and scroll all the way to the bottom. You'll see this line...<br />
<pre># Add stuff to final html<br />
eval(hook("pgm-realtime_builder.php:add-to-final-html"));</pre><br />
<br />
That's what a hook looks like in the Soholaunch source code. This is where your file will be included. The text inside the hook() function call (pgm-realtime_builder.php:add-to-final-html) is the hook id that you need for your plugin's install_manifest.php file.<br />
<br />
==Create your include file==<br />
In your ''hello-world'' folder, create a file called ''hello-world.php'' (note: actual filename doesn't matter). This file will contain add a javascript alert to the ''$template_footer'' variable's contents. The ''$template_footer'' variable contains all of the website html from the page content downward (so all content that gets swapped-in for #content#, as well as the template html that follows #content# in the template file).<br />
<br />
Contents of hello-world.php...<br />
<pre><?php<br />
$template_footer .= '<script>alert("Hello, World.");</script>';<br />
?></pre><br />
<br />
==Create an install_manifest.php for your plugin==<br />
The ''install_manifest.php'' is the configuration file for your plugin. Every Soholaunch plugin has an ''install_manifest.php''. This file is read by Soholaunch when the user installs the plugin. It tells Soholaunch how to display your plugin (title, author, etc), and where to hook its files into.<br />
<br />
There are two types of content in any given ''install_manifest.php'':<br />
#'''Information''' - plugin title, author, etc<br />
#'''Instructions''' - "hook me in here, here, and here"<br />
<br />
Here's what our install_manifest.php is going to look like...<br />
<pre><?php<br />
# This should match your plugin's folder name<br />
$plugin_folder = "hello-world";<br />
<br />
# These are just for display to the user, you can define them however you see fit (html allowed)<br />
$plugin_title = "Hello World";<br />
$plugin_version = "2.0";<br />
$plugin_author = "Soholaunch.com, Inc.";<br />
$plugin_homepage = "http://example.com";<br />
$plugin_description = "Adds drag and drop 'Hello World' item to the Page Editor";<br />
<br />
/* Include my hello-world.php file at *this* location (specified by hook id found in the Soholaunch source code) */<br />
hook_attach("hello-world.php", "pgm-realtime_builder.php:add-to-final-html");<br />
?></pre><br />
<br />
====Optional: Plugin icon====<br />
If you'd like your plugin to have it's own icon displayed next to it's name in the Plugin Manager (instead of the default puzzle piece graphic), include the image file in your plugin folder, and add a line like this to your install_manifest.php...<br />
$plugin_icon = "my_plugin_icon.gif"<br />
<br />
==Recap: This is what your plugin folder should look like==<br />
At this point your plugin is essentially done.<br />
<br />
Your plugin folder should look like this now...<br />
<br />
<pre>hello-world/<br />
install_manifest.php<br />
main_menu-helloworld.php</pre><br />
<br />
Using winzip, winrar, or other similar archive app, zip-up your ''hello-world'' folder (the folder itself, not just the contents). In Windows, you'd right-click on the ''hello-world'' folder and click "Add to archive..."<br />
<br />
For purposes of example, name your .zip file *hello-world.zip*<br />
<br />
==You're ready==<br />
Your plugin is finished and ready to rock. Log-in to ''/sohoadmin'' and upload/install your hello-world.zip via the Plugin Manager.<br />
<br />
Then view your website, and you should see the "Hello, World" javascript alert.<br />
<br />
[[Category:Plugins]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Creating_a_basic_pluginCreating a basic plugin2013-10-17T22:58:29Z<p>Soho: </p>
<hr />
<div>==Introduction==<br />
This tutorial will walk you through the creation of a basic plugin that opens a javascript alert box with the text "Hello World" in it on every page of your website (annoying, I know, but at least you'll know it's working).<br />
<br />
'''You'll need...'''<br />
#A website with Soholaunch (Pro or Ultra) installed on it.<br />
#Your favorite code editor (for php)<br />
#Comfort editing basic php code<br />
#Some comfort with Soholaunch's file structure will help, but is not essential.<br />
#FTP access to your website<br />
<br />
==Create a folder for your plugin==<br />
Create a folder on your computer called ''hello-world''. All of your plugin's files will go in this folder.<br />
<br />
==Find the hook you want to attach your custom file to==<br />
Open Your FTP client and log-in to your test site. For this example, we're going to add code to your soho-created website's html. The file below builds the website's html...<br />
<pre>public_html/sohoadmin/client_files/pgm-realtime_builder.php</pre><br />
<br />
Open that file, and scroll all the way to the bottom. You'll see this line...<br />
<pre># Add stuff to final html<br />
eval(hook("pgm-realtime_builder.php:add-to-final-html"));</pre><br />
<br />
That's what a hook looks like in the Soholaunch source code. This is where your file will be included. The text inside the hook() function call (pgm-realtime_builder.php:add-to-final-html) is the hook id that you need for your plugin's install_manifest.php file.<br />
<br />
==Create your include file==<br />
In your ''hello-world'' folder, create a file called ''hello-world.php'' (note: actual filename doesn't matter). This file will contain add a javascript alert to the ''$template_footer'' variable's contents. The ''$template_footer'' variable contains all of the website html from the page content downward (so all content that gets swapped-in for #content#, as well as the template html that follows #content# in the template file).<br />
<br />
Contents of hello-world.php...<br />
<pre><?php<br />
$template_footer .= '<script>alert("Hello, World.");</script>';<br />
?></pre><br />
<br />
==Create an install_manifest.php for your plugin==<br />
The ''install_manifest.php'' is the configuration file for your plugin. Every Soholaunch plugin has an ''install_manifest.php''. This file is read by Soholaunch when the user installs the plugin. It tells Soholaunch how to display your plugin (title, author, etc), and where to hook its files into.<br />
<br />
There are two types of content in any given ''install_manifest.php'':<br />
#'''Information''' - plugin title, author, etc<br />
#'''Instructions''' - "hook me in here, here, and here"<br />
<br />
Here's what our install_manifest.php is going to look like...<br />
<pre><?php<br />
# This should match your plugin's folder name<br />
$plugin_folder = "hello-world";<br />
<br />
# These are just for display to the user, you can define them however you see fit (html allowed)<br />
$plugin_title = "Hello World";<br />
$plugin_version = "2.0";<br />
$plugin_author = "Soholaunch.com, Inc.";<br />
$plugin_homepage = "http://example.com";<br />
$plugin_description = "Adds drag and drop 'Hello World' item to the Page Editor";<br />
<br />
/* Include my hello-world.php file at *this* location (specified by hook id found in the Soholaunch source code) */<br />
hook_attach("hello-world.php", "pgm-realtime_builder.php:add-to-final-html");<br />
?></pre><br />
<br />
====Optional: Plugin icon====<br />
If you'd like your plugin to have it's own icon displayed next to it's name in the Plugin Manager (instead of the default puzzle piece graphic), include the image file in your plugin folder, and add a line like this to your install_manifest.php...<br />
$plugin_icon = "my_plugin_icon.gif"<br />
<br />
==Recap: This is what your plugin folder should look like==<br />
At this point your plugin is essentially done.<br />
<br />
Your plugin folder should look like this now...<br />
<br />
<pre>hello-world/<br />
install_manifest.php<br />
main_menu-helloworld.php</pre><br />
<br />
Using winzip, winrar, or other simliar archive app, zip-up your hello-world folder. In Windows, you'd right-click on your hello-world folder and click "Add to archive..."<br />
<br />
For purposes of example, name your .zip file *hello-world.zip*<br />
<br />
==You're ready==<br />
Your plugin is finished and ready to rock. Log-in to ''/sohoadmin'' and upload/install your hello-world.zip via the Plugin Manager.<br />
<br />
Then view your website, and you should see the "Hello, World" javascript alert.<br />
<br />
[[Category:Plugins]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Creating_a_basic_pluginCreating a basic plugin2013-10-17T22:51:51Z<p>Soho: </p>
<hr />
<div>==Introduction==<br />
This tutorial will walk you through the creation of a basic plugin that opens a javascript alert box with the text "Hello World" in it on every page of your website (annoying, I know, but at least you'll know it's working).<br />
<br />
'''You'll need...'''<br />
#A website with Soholaunch (Pro or Ultra) installed on it.<br />
#Your favorite code editor (for php)<br />
#Comfort editing basic php code<br />
#Some comfort with Soholaunch's file structure will help, but is not essential.<br />
#FTP access to your website<br />
<br />
==Create a folder for your plugin==<br />
Create a folder on your computer called "hello-world". All of your plugin's files will go in this folder.<br />
<br />
==Find the hook you want to attach your custom file to==<br />
Open Your FTP client and log-in to your test site. For this example, we're going to add code to your soho-created website's html. The file below builds the website's html...<br />
<pre>public_html/sohoadmin/client_files/pgm-realtime_builder.php</pre><br />
<br />
Open that file, and scroll all the way to the bottom. You'll see this line...<br />
<pre># Add stuff to final html<br />
eval(hook("pgm-realtime_builder.php:add-to-final-html"));</pre><br />
<br />
That's what a hook looks like in the Soholaunch source code. This is where your file will be included. The text inside the hook() function call (pgm-realtime_builder.php:add-to-final-html) is the hook id that you need for your plugin's install_manifest.php file.<br />
<br />
==Create your include file==<br />
In your hello-world folder, create a file called hello-world.php (note: actual filename doesn't matter). This file will contain add a javascript alert to the $template_footer variable's contents. The $template_footer variable contains all of the website html from the page content downward (so all content that gets swapped-in for #content#, as well as the template html that follows #content# in the template file).<br />
<br />
Contents of hello-world.php...<br />
<pre><?php<br />
$template_footer .= '<script>alert("Hello, World.");</script>';<br />
?></pre><br />
<br />
==Create an install_manifest.php for your plugin==<br />
The install_manifest.php is the configuration file for your plugin. Every Soholaunch plugin has an install_manifest.php. This file is read by Soholaunch when the user installs the plugin. It tells Soholaunch how to display your plugin (title, author, etc), and where to hook its files into. "install_manifest.php". <br />
<br />
There are two types of content in any given install_manifest.php:<br />
#'''Information''' - plugin title, author, etc<br />
#'''Instructions''' - "hook me in here, here, and here"<br />
<br />
Here's what our install_manifest.php is going to look like...<br />
<pre><?php<br />
$plugin_folder = "hello-world";<br />
$plugin_title = "Hello World";<br />
$plugin_version = "2.0";<br />
$plugin_author = "Soholaunch.com, Inc.";<br />
$plugin_homepage = "http://example.com";<br />
$plugin_description = "Adds drag and drop 'Hello World' item to the Page Editor";<br />
<br />
/* Include my hello-world.php file at *this* location (specified by hook id found in the Soholaunch source code) */<br />
hook_attach("hello-world.php", "pgm-realtime_builder.php:add-to-final-html");<br />
?></pre><br />
<br />
====Optional: Plugin icon====<br />
If you'd like your plugin to have it's own icon displayed next to it's name in the Plugin Manager (instead of the default puzzle piece graphic), include the image file in your plugin folder, and add a line like this to your install_manifest.php...<br />
$plugin_icon = "my_plugin_icon.gif"<br />
<br />
==Recap: This is what your plugin folder should look like==<br />
At this point your plugin is essentially done.<br />
<br />
Your plugin folder should look like this now...<br />
<br />
<pre>hello-world/<br />
install_manifest.php<br />
main_menu-helloworld.php</pre><br />
<br />
Using winzip, winrar, or other simliar archive app, zip-up your hello-world folder. In Windows, you'd right-click on your hello-world folder and click "Add to archive..."<br />
<br />
For purposes of example, name your .zip file *hello-world.zip*<br />
<br />
==You're ready==<br />
Your plugin is finished and ready to rock. Log-in to ''/sohoadmin'' and upload/install your hello-world.zip via the Plugin Manager.<br />
<br />
Then view your website, and you should see the "Hello, World" javascript alert.<br />
<br />
[[Category:Plugins]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Creating_a_basic_pluginCreating a basic plugin2013-10-17T22:48:01Z<p>Soho: </p>
<hr />
<div>==Introduction==<br />
This tutorial will walk you through the creation of a basic plugin that opens a javascript alert box with the text "Hello World" in it on every page of your website (annoying, I know, but at least you'll know it's working).<br />
<br />
'''You'll need...'''<br />
#A website with Soholaunch (Pro or Ultra) installed on it.<br />
#Your favorite code editor (for php)<br />
#Comfort editing basic php code<br />
#Some comfort with Soholaunch's file structure will help, but is not essential.<br />
#FTP access to your website<br />
<br />
==Create a folder for your plugin==<br />
Create a folder on your computer called "hello-world". All of your plugin's files will go in this folder.<br />
<br />
==Find the hook you want to attach your custom file to==<br />
Open Your FTP client and log-in to your test site. For this example, we're going to add code to your soho-created website's html. The file below builds the website's html...<br />
<pre>public_html/sohoadmin/client_files/pgm-realtime_builder.php</pre><br />
<br />
Open that file, and scroll all the way to the bottom. You'll see this line...<br />
<pre># Add stuff to final html<br />
eval(hook("pgm-realtime_builder.php:add-to-final-html"));</pre><br />
<br />
That's what a hook looks like in the Soholaunch source code. This is where your file will be included. The text inside the hook() function call (pgm-realtime_builder.php:add-to-final-html) is the hook id that you need for your plugin's install_manifest.php file.<br />
<br />
==Create your include file==<br />
In your hello-world folder, create a file called hello-world.php (note: actual filename doesn't matter). This file will contain add a javascript alert to the $template_footer variable's contents. The $template_footer variable contains all of the website html from the page content downward (so all content that gets swapped-in for #content#, as well as the template html that follows #content# in the template file).<br />
<br />
Contents of hello-world.php...<br />
<pre><?php<br />
$template_footer .= '<script>alert("Hello, World.");</script>';<br />
?></pre><br />
<br />
==Create an install_manifest.php for your plugin==<br />
The install_manifest.php is the configuration file for your plugin. Every Soholaunch plugin has an install_manifest.php. This file is read by Soholaunch when the user installs the plugin. It tells Soholaunch how to display your plugin (title, author, etc), and where to hook its files into. "install_manifest.php". <br />
<br />
There are two types of content in any given install_manifest.php:<br />
#'''Information''' - plugin title, author, etc<br />
#'''Instructions''' - "hook me in here, here, and here"<br />
<br />
Here's what our install_manifest.php is going to look like...<br />
<pre><?php<br />
$plugin_folder = "hello-world";<br />
$plugin_title = "Hello World";<br />
$plugin_version = "2.0";<br />
$plugin_author = "Soholaunch.com, Inc.";<br />
$plugin_homepage = "http://example.com";<br />
$plugin_description = "Adds drag and drop 'Hello World' item to the Page Editor";<br />
<br />
/* Include my hello-world.php file at *this* location (specified by hook id found in the Soholaunch source code) */<br />
hook_attach("hello-world.php", "pgm-realtime_builder.php:add-to-final-html");<br />
?></pre><br />
<br />
====Optional: Plugin icon====<br />
If you'd like your plugin to have it's own icon displayed next to it's name in the Plugin Manager (instead of the default puzzle piece graphic), include the image file in your plugin folder, and add a line like this to your install_manifest.php...<br />
$plugin_icon = "my_plugin_icon.gif"<br />
<br />
==Zip your plugin folder==<br />
At this point your plugin is essentially done. <br />
<br />
Your plugin folder should look like this now...<br />
<br />
HELLO_WORLD/<br />
*install_manifest.php<br />
*main_menu-helloworld.php<br />
<br />
Using winzip, winrar, or other simliar archive app, zip-up your HELLO_WORLD folder. So for example if you've got zip options on your right-click menu in Windows, you'd right-click on your HELLO_WORLD folder and click "Add to archive...".<br />
<br />
For purposes of example, name your .zip file hello_world_plugin-v1.zip<br />
<br />
==Good to go!==<br />
Your plugin is finished and ready to rock. Log-in to Pro Edition and upload/install your hello_world_plugin-v1.zip via the Plugin Manager.<br />
<br />
Then check out the main menu.<br />
<br />
<br />
==Notes/Afterwards==<br />
*Considering that we just wanted to add a line of text, using the [[Hook_overwrite|hook_overwrite]] method to replace the entire main_menu.php file with our own copy was more than a little excessive. Once you get comfortable with the basics, you'll be using [[hook_replace]] for this kind of thing. It's also usually better to use [[hook_replace]] over hook_overwrite because it tends to be ''much'' more forward-compatible and software update-friendly.<br />
<br />
===sample_module.php===<br />
If you're going to create a management module for your plugin, a great place to start is by making a copy of the following file (added in v4.9 r36)... <br />
'''sohoadmin/program/modules/sample_module.php'''<br />
<br />
With this file you already have the basic structure of a Soholaunch feature module. A quick way to start building your module is to make a copy of this file, rename it as (i.e.) mymodule.php, then stick a link to sohoadmin/program/modules/mymodule.php somewhere on the Main Menu (by hacking sohoadmin/program/main_menu.php) so you can access it as you're developing it. Just don't run Software Updates while you're working on it via this method though or you'll lose your main menu hack.<br />
<br />
[[Category:Plugins]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Creating_a_basic_pluginCreating a basic plugin2013-10-17T22:44:05Z<p>Soho: </p>
<hr />
<div>==Introduction==<br />
This tutorial will walk you through the creation of a basic plugin that opens a javascript alert box with the text "Hello World" in it on every page of your website (annoying, I know, but at least you'll know it's working).<br />
<br />
'''You'll need...'''<br />
#A website with Soholaunch (Pro or Ultra) installed on it.<br />
#Your favorite code editor (for php)<br />
#Comfort editing basic php code<br />
#Some comfort with Soholaunch's file structure will help, but is not essential.<br />
#FTP access to your website<br />
<br />
==Create a folder for your plugin==<br />
Create a folder on your computer called "hello-world". All of your plugin's files will go in this folder.<br />
<br />
==Find the hook you want to attach your custom file to==<br />
Open Your FTP client and log-in to your test site. For this example, we're going to add code to your soho-created website's html. The file below builds the website's html...<br />
<pre>public_html/sohoadmin/client_files/pgm-realtime_builder.php</pre><br />
<br />
Open that file, and scroll all the way to the bottom. You'll see this line...<br />
<pre># Add stuff to final html<br />
eval(hook("pgm-realtime_builder.php:add-to-final-html"));</pre><br />
<br />
That's what a hook looks like in the Soholaunch source code. This is where your file will be included. The text inside the hook() function call (pgm-realtime_builder.php:add-to-final-html) is the hook id that you need for your plugin's install_manifest.php file.<br />
<br />
==Create your include file==<br />
In your hello-world folder, create a file called hello-world.php (note: actual filename doesn't matter). This file will contain add a javascript alert to the $template_footer variable's contents. The $template_footer variable contains all of the website html from the page content downward (so all content that gets swapped-in for #content#, as well as the template html that follows #content# in the template file).<br />
<br />
Contents of hello-world.php...<br />
<pre><?php<br />
$template_footer .= '<script>alert("Hello, World.");</script>';<br />
?></pre><br />
<br />
==Create an install_manifest.php for your plugin==<br />
The install_manifest.php is the configuration file for your plugin. Every Soholaunch plugin has an install_manifest.php. This file is read by Soholaunch when the user installs the plugin. It tells Soholaunch how to display your plugin (title, author, etc), and where to hook its files into. "install_manifest.php". <br />
<br />
There are two types of content in any given install_manifest.php:<br />
#'''Information''' - plugin title, author, etc<br />
#'''Instructions''' - "hook me in here, here, and here"<br />
<br />
Here's what our install_manifest.php is going to look like...<br />
<pre><?php<br />
$plugin_folder = "hello-world";<br />
$plugin_title = "Hello World";<br />
$plugin_version = "2.0";<br />
$plugin_author = "Soholaunch.com, Inc.";<br />
$plugin_homepage = "http://example.com";<br />
$plugin_description = "Adds drag and drop 'Hello World' item to the Page Editor";<br />
<br />
hook_attach("hello-world.php", "pgm-realtime_builder.php:add-to-final-html");<br />
?></pre><br />
<br />
====Optional: Plugin icon====<br />
If you'd like your plugin to have it's own icon displayed next to it's name in the Plugin Manager (instead of the default puzzle piece graphic), include the image file in your plugin folder, and add a line like this to your install_manifest.php...<br />
$plugin_icon = "my_plugin_icon.gif"<br />
<br />
===Tell Pro Edition how to plug-in your plugin===<br />
This is the part where you tell Pro Edition how and where to plug-in your plugin (heh). So our specific task at the moment is to tell Pro Edition (through our install manifest) to add our "- Hello World" change to the main menu.<br />
<br />
Add this line to your install_manifest.php file...<br />
<pre><br />
hook_overwrite("sohoadmin/program/main_menu.php", "main_menu-helloworld.php");<br />
</pre><br />
The [[hook_overwrite]] function tells Pro Edition to use your version of main_menu.php (main_menu-helloworld.php) instead of the regular one.<br />
<br />
===Completed install manifest===<br />
Here's what your completed install_manifest.php file should look like...<br />
<pre><br />
<?<br />
# PLUGIN INFO<br />
$plugin_folder = "HELLO_WORLD";<br />
$plugin_title = "Hello World";<br />
$plugin_version = "1.0";<br />
$plugin_author = "John Smith";<br />
$plugin_homepage = "http://example.com";<br />
<br />
# Description text<br />
$plugin_description = "Adds '- Hello World!' next to the 'Basic Features Group' on the main menu.";<br />
<br />
# Replace main_menu.php with my custom-modified version<br />
hook_overwrite("sohoadmin/program/main_menu.php", "main_menu-helloworld.php");<br />
?><br />
</pre><br />
<br />
==Zip your plugin folder==<br />
At this point your plugin is essentially done. <br />
<br />
Your plugin folder should look like this now...<br />
<br />
HELLO_WORLD/<br />
*install_manifest.php<br />
*main_menu-helloworld.php<br />
<br />
Using winzip, winrar, or other simliar archive app, zip-up your HELLO_WORLD folder. So for example if you've got zip options on your right-click menu in Windows, you'd right-click on your HELLO_WORLD folder and click "Add to archive...".<br />
<br />
For purposes of example, name your .zip file hello_world_plugin-v1.zip<br />
<br />
==Good to go!==<br />
Your plugin is finished and ready to rock. Log-in to Pro Edition and upload/install your hello_world_plugin-v1.zip via the Plugin Manager.<br />
<br />
Then check out the main menu.<br />
<br />
<br />
==Notes/Afterwards==<br />
*Considering that we just wanted to add a line of text, using the [[Hook_overwrite|hook_overwrite]] method to replace the entire main_menu.php file with our own copy was more than a little excessive. Once you get comfortable with the basics, you'll be using [[hook_replace]] for this kind of thing. It's also usually better to use [[hook_replace]] over hook_overwrite because it tends to be ''much'' more forward-compatible and software update-friendly.<br />
<br />
===sample_module.php===<br />
If you're going to create a management module for your plugin, a great place to start is by making a copy of the following file (added in v4.9 r36)... <br />
'''sohoadmin/program/modules/sample_module.php'''<br />
<br />
With this file you already have the basic structure of a Soholaunch feature module. A quick way to start building your module is to make a copy of this file, rename it as (i.e.) mymodule.php, then stick a link to sohoadmin/program/modules/mymodule.php somewhere on the Main Menu (by hacking sohoadmin/program/main_menu.php) so you can access it as you're developing it. Just don't run Software Updates while you're working on it via this method though or you'll lose your main menu hack.<br />
<br />
[[Category:Plugins]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Creating_a_basic_pluginCreating a basic plugin2013-10-17T22:38:37Z<p>Soho: </p>
<hr />
<div>==Introduction==<br />
This tutorial will walk you through the creation of a basic plugin that opens a javascript alert box with the text "Hello World" in it on every page of your website (annoying, I know, but at least you'll know it's working).<br />
<br />
'''You'll need...'''<br />
#A website with Soholaunch (Pro or Ultra) installed on it.<br />
#Your favorite code editor (for php)<br />
#Comfort editing basic php code<br />
#Some comfort with Soholaunch's file structure will help, but is not essential.<br />
#FTP access to your website<br />
<br />
==Create a folder for your plugin==<br />
Create a folder on your computer called "hello-world". All of your plugin's files will go in this folder.<br />
<br />
==Find the hook you want to attach your custom file to==<br />
Open Your FTP client and log-in to your test site. For this example, we're going to add code to your soho-created website's html. The file below builds the website's html...<br />
<pre>public_html/sohoadmin/client_files/pgm-realtime_builder.php</pre><br />
<br />
Open that file, and scroll all the way to the bottom. You'll see this line...<br />
<pre># Add stuff to final html<br />
eval(hook("pgm-realtime_builder.php:add-to-final-html"));</pre><br />
<br />
That's what a hook looks like in the Soholaunch source code. This is where your file will be included. The text inside the hook() function call (pgm-realtime_builder.php:add-to-final-html) is the hook id that you need for your plugin's install_manifest.php file.<br />
<br />
==Create your include file==<br />
In your hello-world folder, create a file called hello-world.php (note: actual filename doesn't matter). This file will contain add a javascript alert to the $template_footer variable's contents. The $template_footer variable contains all of the website html from the page content downward (so all content that gets swapped-in for #content#, as well as the template html that follows #content# in the template file).<br />
<br />
Contents of hello-world.php...<br />
<pre><?php<br />
$template_footer .= '<script>alert("Hello, World.");</script>';<br />
?></pre><br />
<br />
<br />
<br />
==Modify source file==<br />
No pull up the file in your trusty code editor.<br />
<br />
Do a ctrl+f (find) on "Basic Features Group", and you should get to a line that looks something like...<br />
<pre><br />
<td class="fgroup_title"><? echo lang("Basic Features Group"); ?></td><br />
</pre><br />
<br />
Modify this line so it looks like this:<br />
<pre><br />
<td class="fgroup_title"><? echo lang("Basic Features Group"); ?> - Hello World</td><br />
</pre><br />
<br />
Save the file.<br />
<br />
==Create an install_manifest.php for your plugin==<br />
Still in your code editor, create a new blank document (i.e. ctrl + n) and save to your HELLO_WORLD folder as "install_manifest.php". <br />
<br />
install_manifest.php is the file that Pro Edition reads to know what to do when it attempts to install your plugin. All plugins must have a valid install_manifest.php in their folder.<br />
<br />
There are two types of content in any given install_manifest.php:<br />
#'''Information''' - plugin title, author, etc<br />
#'''Instructions''' - "hook me in here, here, and here"<br />
<br />
===Include basic descriptive info about your plugin===<br />
Let's start with the information part. Copy-paste the following lines into your new (and completely empty at this point) install_manifest.php file...<br />
<pre><br />
# PLUGIN INFO<br />
$plugin_folder = "HELLO_WORLD";<br />
$plugin_title = "Hello World";<br />
$plugin_version = "1.0";<br />
$plugin_author = "John Smith";<br />
$plugin_homepage = "http://example.com";<br />
<br />
# Description text<br />
$plugin_description = "Adds '- Hello World!' next to the 'Basic Features Group' on the main menu.";<br />
</pre><br />
<br />
===Additional (optional) stuff you can also include===<br />
<br />
====Custom icon image for your plugin====<br />
If you'd like your plugin to have it's own icon displayed next to it's name in the Plugin Manager (instead of the default puzzle piece graphic), include the image file in your plugin folder, and add a line like this to your install_manifest.php...<br />
$plugin_icon = "my_plugin_icon.gif"<br />
<br />
===Tell Pro Edition how to plug-in your plugin===<br />
This is the part where you tell Pro Edition how and where to plug-in your plugin (heh). So our specific task at the moment is to tell Pro Edition (through our install manifest) to add our "- Hello World" change to the main menu.<br />
<br />
Add this line to your install_manifest.php file...<br />
<pre><br />
hook_overwrite("sohoadmin/program/main_menu.php", "main_menu-helloworld.php");<br />
</pre><br />
The [[hook_overwrite]] function tells Pro Edition to use your version of main_menu.php (main_menu-helloworld.php) instead of the regular one.<br />
<br />
===Completed install manifest===<br />
Here's what your completed install_manifest.php file should look like...<br />
<pre><br />
<?<br />
# PLUGIN INFO<br />
$plugin_folder = "HELLO_WORLD";<br />
$plugin_title = "Hello World";<br />
$plugin_version = "1.0";<br />
$plugin_author = "John Smith";<br />
$plugin_homepage = "http://example.com";<br />
<br />
# Description text<br />
$plugin_description = "Adds '- Hello World!' next to the 'Basic Features Group' on the main menu.";<br />
<br />
# Replace main_menu.php with my custom-modified version<br />
hook_overwrite("sohoadmin/program/main_menu.php", "main_menu-helloworld.php");<br />
?><br />
</pre><br />
<br />
==Zip your plugin folder==<br />
At this point your plugin is essentially done. <br />
<br />
Your plugin folder should look like this now...<br />
<br />
HELLO_WORLD/<br />
*install_manifest.php<br />
*main_menu-helloworld.php<br />
<br />
Using winzip, winrar, or other simliar archive app, zip-up your HELLO_WORLD folder. So for example if you've got zip options on your right-click menu in Windows, you'd right-click on your HELLO_WORLD folder and click "Add to archive...".<br />
<br />
For purposes of example, name your .zip file hello_world_plugin-v1.zip<br />
<br />
==Good to go!==<br />
Your plugin is finished and ready to rock. Log-in to Pro Edition and upload/install your hello_world_plugin-v1.zip via the Plugin Manager.<br />
<br />
Then check out the main menu.<br />
<br />
<br />
==Notes/Afterwards==<br />
*Considering that we just wanted to add a line of text, using the [[Hook_overwrite|hook_overwrite]] method to replace the entire main_menu.php file with our own copy was more than a little excessive. Once you get comfortable with the basics, you'll be using [[hook_replace]] for this kind of thing. It's also usually better to use [[hook_replace]] over hook_overwrite because it tends to be ''much'' more forward-compatible and software update-friendly.<br />
<br />
===sample_module.php===<br />
If you're going to create a management module for your plugin, a great place to start is by making a copy of the following file (added in v4.9 r36)... <br />
'''sohoadmin/program/modules/sample_module.php'''<br />
<br />
With this file you already have the basic structure of a Soholaunch feature module. A quick way to start building your module is to make a copy of this file, rename it as (i.e.) mymodule.php, then stick a link to sohoadmin/program/modules/mymodule.php somewhere on the Main Menu (by hacking sohoadmin/program/main_menu.php) so you can access it as you're developing it. Just don't run Software Updates while you're working on it via this method though or you'll lose your main menu hack.<br />
<br />
[[Category:Plugins]]</div>Sohohttps://wiki.soholaunch.com/index.php?title=Creating_a_basic_pluginCreating a basic plugin2013-10-17T22:31:17Z<p>Soho: </p>
<hr />
<div>==Introduction==<br />
This tutorial will walk you through the creation of a basic plugin that opens a javascript alert box with the text "Hello World" in it on every page of your website (annoying, I know, but at least you'll know it's working).<br />
<br />
'''You'll need...'''<br />
#A website with Soholaunch (Pro or Ultra) installed on it.<br />
#Your favorite code editor (for php)<br />
#Comfort editing basic php code<br />
#Some comfort with Soholaunch's file structure will help, but is not essential.<br />
#FTP access to your website<br />
<br />
==Create a folder for your plugin==<br />
Create a folder on your computer called "hello-world". All of your plugin's files will go in this folder.<br />
<br />
==Find the hook you want to attach your custom file to==<br />
Open Your FTP client and log-in to your test site. For this example, we're going to add code to your soho-created website's html. The file below builds the website's html...<br />
<pre>public_html/sohoadmin/client_files/pgm-realtime_builder.php</pre><br />
<br />
Open that file, and scroll all the way to the bottom. You'll see this line...<br />
<pre># Add stuff to final html<br />
eval(hook("pgm-realtime_builder.php:add-to-final-html"));</pre><br />
<br />
That's what a hook looks like in the Soholaunch source code. This is where your file will be included. The text inside the hook() function call (pgm-realtime_builder.php:add-to-final-html) is the hook id that you need for your plugin's install_manifest.php file.<br />
<br />
Stick this file in the "HELLO_WORLD" folder you created on your PC, and rename it to something like "main_menu-helloworld.php" (actual filename doesn't really matter, as long as you recognize it as your modified version of main_menu.php).<br />
<br />
==Modify source file==<br />
No pull up the file in your trusty code editor.<br />
<br />
Do a ctrl+f (find) on "Basic Features Group", and you should get to a line that looks something like...<br />
<pre><br />
<td class="fgroup_title"><? echo lang("Basic Features Group"); ?></td><br />
</pre><br />
<br />
Modify this line so it looks like this:<br />
<pre><br />
<td class="fgroup_title"><? echo lang("Basic Features Group"); ?> - Hello World</td><br />
</pre><br />
<br />
Save the file.<br />
<br />
==Create an install_manifest.php for your plugin==<br />
Still in your code editor, create a new blank document (i.e. ctrl + n) and save to your HELLO_WORLD folder as "install_manifest.php". <br />
<br />
install_manifest.php is the file that Pro Edition reads to know what to do when it attempts to install your plugin. All plugins must have a valid install_manifest.php in their folder.<br />
<br />
There are two types of content in any given install_manifest.php:<br />
#'''Information''' - plugin title, author, etc<br />
#'''Instructions''' - "hook me in here, here, and here"<br />
<br />
===Include basic descriptive info about your plugin===<br />
Let's start with the information part. Copy-paste the following lines into your new (and completely empty at this point) install_manifest.php file...<br />
<pre><br />
# PLUGIN INFO<br />
$plugin_folder = "HELLO_WORLD";<br />
$plugin_title = "Hello World";<br />
$plugin_version = "1.0";<br />
$plugin_author = "John Smith";<br />
$plugin_homepage = "http://example.com";<br />
<br />
# Description text<br />
$plugin_description = "Adds '- Hello World!' next to the 'Basic Features Group' on the main menu.";<br />
</pre><br />
<br />
===Additional (optional) stuff you can also include===<br />
<br />
====Custom icon image for your plugin====<br />
If you'd like your plugin to have it's own icon displayed next to it's name in the Plugin Manager (instead of the default puzzle piece graphic), include the image file in your plugin folder, and add a line like this to your install_manifest.php...<br />
$plugin_icon = "my_plugin_icon.gif"<br />
<br />
===Tell Pro Edition how to plug-in your plugin===<br />
This is the part where you tell Pro Edition how and where to plug-in your plugin (heh). So our specific task at the moment is to tell Pro Edition (through our install manifest) to add our "- Hello World" change to the main menu.<br />
<br />
Add this line to your install_manifest.php file...<br />
<pre><br />
hook_overwrite("sohoadmin/program/main_menu.php", "main_menu-helloworld.php");<br />
</pre><br />
The [[hook_overwrite]] function tells Pro Edition to use your version of main_menu.php (main_menu-helloworld.php) instead of the regular one.<br />
<br />
===Completed install manifest===<br />
Here's what your completed install_manifest.php file should look like...<br />
<pre><br />
<?<br />
# PLUGIN INFO<br />
$plugin_folder = "HELLO_WORLD";<br />
$plugin_title = "Hello World";<br />
$plugin_version = "1.0";<br />
$plugin_author = "John Smith";<br />
$plugin_homepage = "http://example.com";<br />
<br />
# Description text<br />
$plugin_description = "Adds '- Hello World!' next to the 'Basic Features Group' on the main menu.";<br />
<br />
# Replace main_menu.php with my custom-modified version<br />
hook_overwrite("sohoadmin/program/main_menu.php", "main_menu-helloworld.php");<br />
?><br />
</pre><br />
<br />
==Zip your plugin folder==<br />
At this point your plugin is essentially done. <br />
<br />
Your plugin folder should look like this now...<br />
<br />
HELLO_WORLD/<br />
*install_manifest.php<br />
*main_menu-helloworld.php<br />
<br />
Using winzip, winrar, or other simliar archive app, zip-up your HELLO_WORLD folder. So for example if you've got zip options on your right-click menu in Windows, you'd right-click on your HELLO_WORLD folder and click "Add to archive...".<br />
<br />
For purposes of example, name your .zip file hello_world_plugin-v1.zip<br />
<br />
==Good to go!==<br />
Your plugin is finished and ready to rock. Log-in to Pro Edition and upload/install your hello_world_plugin-v1.zip via the Plugin Manager.<br />
<br />
Then check out the main menu.<br />
<br />
<br />
==Notes/Afterwards==<br />
*Considering that we just wanted to add a line of text, using the [[Hook_overwrite|hook_overwrite]] method to replace the entire main_menu.php file with our own copy was more than a little excessive. Once you get comfortable with the basics, you'll be using [[hook_replace]] for this kind of thing. It's also usually better to use [[hook_replace]] over hook_overwrite because it tends to be ''much'' more forward-compatible and software update-friendly.<br />
<br />
===sample_module.php===<br />
If you're going to create a management module for your plugin, a great place to start is by making a copy of the following file (added in v4.9 r36)... <br />
'''sohoadmin/program/modules/sample_module.php'''<br />
<br />
With this file you already have the basic structure of a Soholaunch feature module. A quick way to start building your module is to make a copy of this file, rename it as (i.e.) mymodule.php, then stick a link to sohoadmin/program/modules/mymodule.php somewhere on the Main Menu (by hacking sohoadmin/program/main_menu.php) so you can access it as you're developing it. Just don't run Software Updates while you're working on it via this method though or you'll lose your main menu hack.<br />
<br />
[[Category:Plugins]]</div>Soho