Home
Why was it created?
In forumotion, you can customize the template to make the theme as you like. With complex theme, the number template must be edited as much. Later, to store or share it with friends, you'll have to copy > paste each template, because Forumotion doesn't support this function. It was a very boring job and takes time, sometimes occurs confusion. So, I wrote it.
Features
Backup and recovery templates will help you backup and recovery of all templates in Forumotion quickly and accurately.
- All templates will be compressed into a zip file to store and share very convenient.
- Import the backup file from your computer with sufficient information and warning to help avoid confusion version.
- Notification on your desktop when this process is complete, you just keep tabs open while script is processing.
- One-Click mode: Simplify operations with one-click, if you need to import and export all your templates.
Screenshot
Video tutorial
How to set up?
Create an HTML page
To create an HTML page, go to Administration Panel > Modules > HTML pages management and create a new page with the following settings.
Title: Backup and recovery templates
Use your forum header and footer: No
Use this page as homepage: No
Page content:
- Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Forumotion backup templates</title>
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="imagetoolbar" content="no" />
<link href="https://illiweb.com/rs3/10/frm/admin/admin.css" rel="stylesheet" type="text/css" media="screen" />
<style>
#zzBackup fieldset {
counter-reset: section;
border: 1px solid #07f
}
#zzBackup legend {
color: #e000a2
}
#zzBackup ol {
margin: 5px 0 15px;
list-style: none outside none
}
#zzBackup li:before {
counter-increment: section;
content: counter(section) '.';
width: 30px;
display: inline-block;
text-align: right;
margin-right: 5px
}
.backupOption {
font-size: 18px;
color: #00a8a1
}
#importNoti strong {
color: #DA4FB8
}
#zzBackup dt label {
display: block;
margin-top: 10px;
color: #777
}
#zzBackup dt label:hover {
color: #111
}
#zzBackup label input:checked ~ span {
color: #0094CA
}
.buttonOne {
display: none;
margin-top: 10px;
padding: 7px 20px;
background: #f90e5e;
color: #FFF;
font-weight: 700;
border: 3px solid #DDD
}
.buttonOne:hover {
border-color: #444;
cursor: pointer
}
.buttonOne:active {
background: #444
}
#zzBackup:disabled,
#zzBackup:disabled ~ span {
color: #999;
cursor: not-allowed
}
#skin,
#version,
#importSkinStatus {
display: none
}
.icon_loading {
background: url(https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/icons/load.gif) 2px 2px/14px 14px no-repeat transparent;
border-color: #FFAE00;
color: #FFAE00;
}
</style>
</head>
<body>
<a name="top"></a>
<div class="conteneur_minwidth_IE">
<div class="conteneur_layout_IE">
<div class="conteneur_container_IE">
<div id="page-header" class="clearfix">
<a href="/admin/index.forum"><img src="https://2img.net/i/bl/logo.png" alt="logo" class="logo" />
</a><a href="/" class="url">...</a>
<div style="padding: 10px;">
<h2 id="user_connected">...</h2>
</div>
<ul class="preview_forum clearfix">
<li class="header_admin_left"><img src="https://2img.net/i/fa/admin/icones/loupe.png" alt="" /><a href="/" target="_blank">PREVIEW FORUM</a>
</li>
<li class="header_admin_right"><img src="https://i19.servimg.com/u/f19/18/83/32/63/video_11.png" alt="Toggle" /><a href="https://youtu.be/J6oeQ_f8nQw" target="_blank">VIDEO TUTORIAL</a>
</li>
</ul>
</div>
<div id="page-body">
<div id="tabs" class="clearfix">
<ul>
<li id="activetab" class="tabLi"><a href="#templates" class="tabA"><span>Templates</span></a>
</li>
<li class="tabLi"><a href="#skin" class="tabA"><span>Skin</span></a>
</li>
<li class="tabLi"><a href="#version" class="tabA"><span>Version</span></a>
</li>
</ul>
</div>
<!-- <div class="panel"> -->
<div id="wrapper">
<div id="content" class="clearfix">
<div id="main" class="expended_main">
<div id="main-content">
<h2>Themes management</h2>
<ul class="h2-breadcrumb clearfix">
<li id="backupMode" class="first">Templates</li>
</ul>
<div id="templates" class="tabDiv"></div>
<div id="skin" class="tabDiv">
<blockquote class="block_left">
<p class="explain">In this space you can export/import your favorites <strong>skins</strong>. You can also restore old <strong>skins</strong> already used.</p>
</blockquote>
<form method="post" name="" action="/admin/index.forum?part=themes&sub=styles&mode=export&extended_admin=1">
<input type="hidden" name="mode" value="export" />
<fieldset class="style-theme-export">
<legend>Export your skin</legend>
<dl class="clearfix">
<dt>
<label for="options"><img src="https://2img.net/i/fa/admin/icones/question2.png" align="absmiddle" title="Your can export your style or just a part of it, if you want to share or backup." /> Export your skin</label>
</dt>
<dd>
<select id="theme_choosen" name="theme_choosen">
<option value="actual">Current skin</option>
</select> :
<select id="options" name="options">
<option value="all">Whole style</option>
<option value="album">Only the gallery</option>
<option value="col">Only colors</option>
<option value="img">All images</option>
<option value="img_gen">Images : General and explore</option>
<option value="img_forum">Images : Forum Icons</option>
<option value="img_topics">Images : Topics icons</option>
<option value="img_icons">Images : Mini-icons</option>
<option value="img_buttons">Images : buttons</option>
<option value="msg_icons">Messages icons</option>
</select>
<div class="div_btns">
<input type="submit" name="submit" value="Export" class="icon_ok" />
</div>
</dd>
</dl>
</fieldset>
</form>
<form target="noreload" method="post" name="" action="/admin/index.forum?part=themes&sub=styles&mode=export&extended_admin=1" enctype="multipart/form-data">
<input type="hidden" name="mode" value="import" />
<fieldset class="style-theme-export">
<legend>Import the skin</legend>
<p id="importSkinStatus" class="messagebox"><img src="https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/icons/success.gif" alt="icon" style="height: 13px; width: 13px; vertical-align: middle; margin-top: -3px;" /> Skin import is <span style="color:green">complete</span>.</p>
<dl class="clearfix">
<dt>
<label for="importfile"><img src="https://2img.net/i/fa/admin/icones/question2.png" title="Here you can import a skin you received from another forum. Your current skin will be replaced. Export it completely at least once before importing a new one!" /> Import the skin</label>
</dt>
<dd>
<input type="file" id="importfile" name="importfile" />
<div class="div_btns">
<input type="submit" name="submit" value="Import" class="icon_ok" />
</div>
</dd>
</dl>
</fieldset>
</form>
<iframe width="0" height="0" frameborder="0" name="noreload" id="uploadSkin"></iframe>
</div>
<div id="version" class="tabDiv">
<blockquote class="block_left">
<p class="explain">You defined a personalized style sheet, if you change version it will be deleted and the version default style will be applied.</p>
</blockquote>
<form action="/admin/index.forum?part=themes&sub=styles&mode=version&extended_admin=1" method="post" name="form_version">
<fieldset>
<legend>Forumotion version</legend>
<dl>
<dt>
<label>Change version :</label>
</dt>
<dd>
<input type="radio" name="tpl" id="subsilver" value="subsilver" class="radio" />
<label for="subsilver" dir=""> phpBB2</label>
<input type="radio" name="tpl" id="prosilver" value="prosilver" class="radio" />
<label for="prosilver" dir=""> phpBB3</label>
<input type="radio" name="tpl" id="punbb" value="punbb" class="radio" />
<label for="punbb" dir=""> PunBB</label>
<input type="radio" name="tpl" id="invision" value="invision" class="radio" />
<label for="invision" dir=""> Invision</label>
</dd>
</dl>
<div class="div_btns">
<input type="hidden" name="keep_theme" id="keep_theme_defaut" value="2" checked="checked" class="radio" />
<input type="submit" class="icon_ok" value="Save" name="change_version" />
</div>
</fieldset>
</form>
</div>
</div>
<!-- closing tag for #main-content -->
</div>
<!-- closing tag for #main -->
<div id="tools"></div>
<!-- closing tag for #tools -->
</div>
<!-- closing tag for #content -->
</div>
<!-- closing tag for #wrapper -->
<div class="clear"></div>
<p class="bottom-help">
<a class="help-link" href="https://github.com/lelinhtinh/ForumotionBackupTemplates/issues" target="_blank"><img src="https://2img.net/i/fa/admin/icones/help.png" align="middle" alt="help" />
</a>
</p>
<!-- We request you retain the full copyright notice below including the link to www.phpbb.com.This not only gives respect to the large amount of time given freely by the developersbut also helps build interest, traffic and use of phpBB2. If you (honestly) cannot retainthe full copyright we ask you at least leave in place the "Powered by phpBB" line, with"phpBB" linked to www.phpbb.com. If you refuse to include even this then support on ourforums may be affected.The phpBB Group : 2006-->
</div>
<!-- closing tag for #page-body -->
<div id="page-footer"></div>
<a name="down"></a>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/latest/jszip.min.js" type="text/javascript"></script>
<script src="https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/latest/jszip-utils.min.js" type="text/javascript"></script>
<script src="https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/latest/FileSaver.min.js" type="text/javascript"></script>
<script src="https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/latest/fmbackup.js" type="text/javascript"></script>
<script type="text/javascript">
fmbackup.page_id = "PAGE_ID";
fmbackup.init();
</script>
</body>
</html>
Modifications: At end of code, Replace PAGE_ID by the ID of HTML page you just created.
Options
Translation (Optional)
- Code:
fmbackup.translation = {
langcode: "en",
ex: {
title: "Export Template",
tooltip: "In this space, you can also export [[changed template]] to a *.zip file and save it to your computer.\nTo start, click {{Check}} button to get version information and the list of templates that you want to export. Then click {{Ok}}, wait for few seconds and you are good to go.",
checkall: "Pick all",
unpublish: "Waiting Templates",
firsttip: "Pick categories you need then click {{Check}}.",
download: "Downloading your templates. Click here if its take too long!",
download2: "Your templates have been downloaded.",
notemplate: "There's no template archive needed",
sumtemplate: "The number of template archive needed it's",
presssubmit: "Click {{Ok}} to start!",
pressrefresh: "Click {{Start over}} to change your options!",
loading: "Creating Zip file..."
},
im: {
title: "Import Template",
tooltip: "In this space, you can also import template from a *.zip file. Attention: your version must match with the version of the template you are going to import.\nTo start, click [[Open file]] (Browse...) pick your template zipped file (*.zip). Then click {{Ok}}, wait for few seconds and you are good to go.",
choose: "Open zipped file",
notpublish: "Not publish Template",
firsttip: "Pick your zipped file then click {{Ok}}.",
notname: "Opps! File name is <<not valid>>.",
notversion: "Opps! This template require ",
source: "Source",
version: "Version",
time: "Last update",
count: "Template(s)",
updateAll: "All done!",
loading: "Updating template..."
},
decs: "Export/import all of templates in forumotion <<quickly>> and <<accurately>>.",
option: "Options",
simpleclick: "One-Click mode",
wail: "Please hold on a second...",
notsupport: "Your browser does not support this application!",
requestlimit: "Access denied! Progress will start over in a while",
reloadtemplate: "Reload template ",
errortemplate: "Bad template ",
second: "s.",
filtering: "Template filtering...",
checkone: "Pick at least 1 item",
progressrun: "Progress is running.",
bt: {
filter: "Check",
refresh: "Start over",
submit: "Ok",
start: "START",
}
};
Translate the phrase in quotes, retain the special character [[]] {{}} << >>.
Change icons (Optional)
- Code:
fmbackup.icons = {
good: "https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/icons/good.png",
bad: "https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/icons/bad.png",
load: "https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/icons/load.gif",
info: "https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/icons/info.png",
error: "https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/icons/error.gif",
success: "https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/icons/success.gif",
disable: "https://lelinhtinh.github.io/ForumotionBackupTemplates/cdn/icons/disable.png"
};
Icon sizes: good, bad: 48x48 px, other: 16x16 px.
Page id (Require)
- Code:
fmbackup.page_id = "PAGE_ID";
Replace PAGE_ID by the ID of HTML page Backup and recovery templates.
Run (Require)
- Code:
fmbackup.init();
Example
Translations into Vietnamese and has page-id as 28.
- Code:
<script type="text/javascript">
fmbackup.translation = {
langcode: "vi",
ex: {
title: "Xuất Template",
tooltip: "Trong bảng này, bạn có thể xuất tất cả [[template đã được thay đổi]] của bạn vào một tập tin nén (.zip) và tải nó về máy.\nĐể bắt đầu, bạn nhấn vào nút {{Kiểm tra}} để lấy thông tin phiên bản và danh sách template cần xuất. Sau đó nhấn {{Xác nhận}} và chờ tiến trình hoàn thành.",
checkall: "Chọn tất cả",
unpublish: "Template chưa công khai",
firsttip: "Chọn các mục chứa template cần lưu trữ và nhấn {{Kiểm tra}}.",
download: "Tập tin đang được tải xuống. Nhấn vào đây nếu bạn đợi quá lâu.",
download2: "Template của bạn đã được tải xong.",
notemplate: "Không có template cần lưu trữ.",
sumtemplate: "Tổng số template cần lưu trữ là",
presssubmit: "Nhấn {{Xác nhận}} để bắt đầu!",
pressrefresh: "Nhấn {{Làm lại}} để chọn mục khác!",
loading: "Đang tạo tập tin lưu trữ..."
},
im: {
title: "Nhập Template",
tooltip: "Trong bảng này, bạn có thể nhập template từ tập tin nén (.zip) đã lưu trữ trước đó. Lưu ý rằng: diễn đàn phải được chạy cùng phiên bản với bản lưu trữ.\nĐể bắt đầu, bạn nhấn [[Chọn tệp]] (Browse...) và tìm đến vị trí tập tin lưu trữ. Sau đó nhấn {{Xác nhận}} và chờ tiến trình hoàn thành.",
choose: "Chọn tập tin lưu trữ",
notpublish: "Không công khai template",
firsttip: "Chọn tập tin đã lưu trữ và nhấn {{Xác nhận}}.",
notname: "Lỗi không tương thích! Tên tập tin <<không hợp lệ>>.",
notversion: "Lỗi không tương thích! Tập tin này lưu trữ Template cho phiên bản",
source: "Nguồn",
version: "Phiên bản",
time: "Lưu lúc",
count: "Số template",
updateAll: "Tất cả template đã được cập nhật.",
loading: "Đang cập nhật template..."
},
decs: "Nhập/Xuất tất cả templates trong Forumotion một cách <<nhanh chóng>> và <<chính xác>>.",
option: "Tùy chọn",
simpleclick: "Chế độ 1-Click",
wail: "Vui lòng chờ trong giây lát...",
notsupport: "Trình duyệt của bạn không hỗ trợ ứng dụng này!",
requestlimit: "Lỗi máy chủ từ chối truy cập! Tiến trình sẽ bắt đầu lại sau",
reloadtemplate: "Tải lại template ",
errortemplate: "Lỗi template ",
second: "giây.",
filtering: "Đang kiểm tra...",
checkone: "Bạn phải chọn ít nhất 1 mục!",
progressrun: "Tiến trình đang xử lý.",
bt: {
filter: "Kiểm tra",
refresh: "Làm lại",
submit: "Xác nhận",
start: "BẮT ĐẦU"
}
};
fmbackup.page_id = 28;
fmbackup.init();
</script>
Source code
Source Code is available on Github: Version 3.0.1
Last edited by Zzbaivong on April 13th 2019, 5:19 am; edited 2 times in total (Reason for editing : v3.0.1)
. Is it possible to adapt these script to do backup the javascript codes too?
when a solution is found.