Ch. 042d Adding "Approve all" to order complete page for custom skins

This is not a required change. If you are not interested in adding an 'Approve all' button to order complete/summary page, you do not need any change to your custom skin. Your site will function just as before. 
 

Custom Skins Managed By Aleyant

If you have one or more active skins managed by Aleyant that you wish us to review please create a support ticket with the following information.
  • Admin URL
  • Admin username or email
  • Account Name (the name of the account chosen during login for super users)
  • List of active skins to be reviewed
Do not send your admin password with the support ticket! We can access your account with username alone.
 

DIY Custom Skins

Adding "Approve all", "Deny all" and "Edit all" to order complete/summary page

 
1. Check if your custom skin has a layout file called "ordersummarylayout.txt"
If "ordersummarylayout.txt" exists in your custom skin root folder, it means you need to update it to add new skin tags to enable the new "Approve all" feature.
Otherwise, if the file does not exist in your custom skin then your custom skin is using the default layout file for order complete/summary page and you do not need any change as we will update the default layout file and your site will have the update automatically.
 
Normally, if your custom skin is based on one of our "Standard" skins (Algernon, Clean & Clear, Ender's Game, Griffin, Holmes, I,Robot, Improved Legacy, Legacy, Moriarty, Rumfoord, Santiago, The Doctor, The Post, Watson), the custom skin will not contain "ordersummarylayout.txt" and you do not need any change to your custom skin.
 
2. Create a Backup
Before you maky any change or your skin, create a backup of your current custom skin files.
 
3. Follow the guide below for your particular skin
 
 

For Custom skins based on one of our Standard skins

  • Algernon
  • Clean & Clear
  • Ender's Game
  • Griffin
  • Holmes
  • I ,Robot
  • Improved Legacy
  • Legacy
  • Moriarty
  • Rumfoord
  • Santiago
  • The Doctor
  • The Post
  • Watson
 
As described above, normally there is not a "ordersummarylayout.txt" layout file inside the skin folder. But in case your skin has one you need to add the ###APPROVALALLINFO### skin tag to the layout file and style it as you want.
 
Here is a screenshot of how we are using it
 
 
 

For Custom skins based on one of Responsive Skins

  • Bootstrap Basic
  • Bootstrap Basic(no sidebar)
  • Cerulean
  • Readable
  • Super Hero
a. find and replace the following code 
<div class="summaryControls">
  ###PRINTLINK###
</div>
with
<div class="summaryControls">
  <div class="row">
    <div class="col-md-6">
      ###PRINTLINK###
    </div>
    <div class="col-md-6">
      ###APPROVALALLINFO###
    </div>
  </div>
</div>
in ordersummarylayout.txt 
 
b. After that, open init.min.css file inside css folder of your custom skin, find and replace the following code
.summaryControls{margin:0 -15px;display:table;width:100%;margin-bottom:5px}.summaryControls div{float:left;width:50%;padding:0 15px}
 
with
.summaryPrintLink{margin-top:5px;margin-bottom:15px}.approveAllForm{text-align:right;margin-bottom:5px}.approveAllForm .btn{margin-right:5px}.approveAllForm .btn:last-child{margin-right:0}
 
 

For Custom skins based on one of our Responsive Skins

  • Responsive #6
  • Responsive #7
  • Responsive #8
  • Responsive #9
  • Responsive Algernon
  • Responsive Algernon(no sidebar)
  • Responsive Clean
  • Responsive Ender's Game
  • Responsive Santiago
  • Responsive Watson 
 
a. Find and replace the following code
<div class="summaryControls">
  ###PRINTLINK###
</div>
with
<div class="summaryControls">
  <div class="row">
    <div class="col-md-6">
      ###PRINTLINK###
    </div>
    <div class="col-md-6">
      ###APPROVALALLINFO###
    </div>
  </div>
</div>
in ordersummarylayout.txt 
 
 
Below is an image of what the order summary/complete page will look like after changing the code correctly.
 
 
Or you can add ###APPROVALALLINFO### skin tag in ordersummarylayout.txt  anywhere and style it as you want.