Backup and recovery templates

by Zzbaivong June 21st 2015, 11:28 am

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 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>  </div>  <div id="tools"></div>  </div>  </div>  <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>  </div>  <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

by JScript June 21st 2015, 1:13 pm

Excellent! I have not tested it yet, but for the great description already gives for me to understand very well ...
Just need to add the templates of the mobile version!

5 stars for me,

JS

by Zzbaivong June 21st 2015, 1:49 pm

Thank you for your compliment. Very Happy

It was added the templates of the mobile version. Try it and write to me your reviews. Wink

by Zeus June 22nd 2015, 7:29 pm

Good job! I have tested the code and it works. Smile

by Van-Helsing July 2nd 2015, 2:36 am

Hello @Zzbaivong,
Another suggestion is to add on your code javascripts backup too;)

Best Regards,
Black-Shadow

by Zzbaivong February 23rd 2016, 3:14 am

In a recent update, the Forum has added a new template. However, you will not need to update for this script, because it was still working well.
Its operating mechanism does not rely on the list of templates, so the update to add or delete a template will not affect it. Only when there is a group of new templates are added (e.g. Mobile version), then you can update the parameter listTempGroup at here.

by Van-Helsing February 23rd 2016, 3:18 am

Hello,
Very nice @Zzbaivong thumleft

. Is it possible to adapt these script to do backup the javascript codes too?

by Zzbaivong February 23rd 2016, 3:23 am

Van-Helsing wrote:Hello,
Very nice @Zzbaivong . Is it possible to adapt these script to do backup the javascript codes too?

Thanks for your ideas, maybe it will be in the next update.

by Van-Helsing February 23rd 2016, 3:25 am

How can I update my current scripts on the browser with the new update?

by Zzbaivong February 23rd 2016, 3:29 am

Currently I do not have any update for this script, if available, I will update at #962990

by hamesashek May 23rd 2017, 2:44 am

Hello

There seems to be something wrong with the code. When you add it in the forum, it turns the page into the main forum page. I do not know the reason, but you tried it on more than one forum and on more than one browser.

by Van-Helsing November 19th 2017, 2:07 am

Hello,
@Zzbaivong Is there an available update for firefox quantum v57.0? The old script is not compatible with newest version of firefox. Sad

by sivastar October 7th 2018, 3:08 am

javascript links all not working

by **SarkZKalie** October 7th 2018, 6:39 am

Unfortunately, Zzbaivong cleaned his project. There was nothing found here

by **brandon_g** October 7th 2018, 2:18 pm

SarkZKalie wrote:Unfortunately, Zzbaivong cleaned his project. There was nothing found here

Should this topic be locked then?

by **SarkZKalie** October 7th 2018, 2:57 pm

I agree with you

by sivastar October 7th 2018, 6:01 pm

just i found the javascript files here

by **brandon_g** October 7th 2018, 8:51 pm

@Zzbaivong Are you still supporting this project?

by Zzbaivong April 11th 2019, 1:01 pm

I really forgot the reason why I stopped supporting this project, but I didn't intentionally hide them. When cleaning up the source code, I moved them to an old-master branch to prepare a full rewrite (but...).
https://github.com/lelinhtinh/ForumotionBackupTemplates/tree/old-master

brandon_g wrote:@Zzbaivong Are you still supporting this project?

No, I gave up. You can lock this topic.

by **brandon_g** April 11th 2019, 4:10 pm

Locked on request

Backup and recovery templates