메뉴 바로가기 본문 바로가기



Smart Themes features

  • This theme editing tool enables you to create your dream store with HTML even without a professional designer.
  • It ensures pleasant shopping environment in any web browsers and boosts the connection speed by simplifying the website.
  • Various template features allow the admin to design without restriction and offer better services to the customers.
1. Theme under editing
  1. It shows the name of the theme currently open for editing.
  1. [In use] icon is only added to the main theme.
2. Bookmarks
  • It is a list where frequently used pages are added as bookmarks.
  • You can change the name of bookmarks or remove them from the list.
3. Add folder/page
  1. You can create folders and pages where desired.
4. Search by page name
  1. You can search for a page using the page name.
  1. Select the page to edit, click [Open] to see the page in the editor.
5. See all
  1. You will see a tree list of all folders in this online store theme.
6. Add to bookmarks
  1. Click the star icon on the left of the page name to add to ‘Bookmarks’.
7. Files being edited
  1. When you click a page to edit from the list on the left, a tab for the selected file will be added on the top.
  1. When multiple files are open, you can click the arrows to find the tab you want, or you can check the list of all open files.
8. Save / Save as / Delete / Close
  1. 1) Save
  • Save the edited page.
  1. 2) Save as
  • Save the selected page under a new name. Select the location to save and enter a new name to save.
  1. 3) Delete
  • Delete the selected page. You can only delete newly added pages and cannot delete the pages added by default.
  1. 4) Close
  • Close the selected page.
9. Preview / Add module / Newest source / History
  1. 1) Preview
  • Click Preview before saving to see how the changes will be applied to the page.
  • In general, you will click Preview after editing in the split view mode or the HTML mode.
  1. 2) Newest source
  • See the newest source for the page currently being edited. The newest source button remains inactive if there if no newest source available.
  • Check the source and click Apply to add the source to the current page. You must click Save to apply the changes.
  1. 3) History
  • See the edit history for the page currently being edited. (Maximum of 10)
  • You can select from the previous file update times to restore the source back to the version from the selected time.
  • You must click Save to apply the changes.
10. Bulk change of source Guide to bulk change of source
  • You can find the specific sources from the files currently being edited to bulk change them.
  • A layer will appear on the bottom when you click [Bulk change source]. (Bulk change source is a function available in the split view mode and the HTML mode.)
  1. • How to restore source
  1. To restore to source codes before change, revert to the recent source codes using the [History] function in the editor.
  1. 1) Find what/Replace with
  • Find what: Enter the word or phrase you want to locate. (Required)
  • Replace with: Enter your new text. When you leave ‘Replace with’ empty and bulk change, the word/phrase will be replaced with a blank.
  1. 2) Replace all
  • All matching words/phrases will be replaced at once.
  • The changes must be saved to be reflected on your store page.
  1. 3) Range
  • Set the range of bulk change.
  • Current file: Make changes in the file currently being edited. (e.g. In the screenshot, bulk change is applied only to the current file (index.html).)
  1. All open files: Make changes in all open files. (e.g. In the screenshot, bulk change is applied to all open files (index.html, detail.html).)
  1. 4) Option
  • Match case: The search terms are case-sensitive.
    1. e.g. When the search term is $Cafe24, only $Cafe24 will be replaced. ($CAFE24 or $cafe24 will not be searched/replaced.)
11. Save all/Close all
  1. Save all: Save all open pages.
  1. Close all: Close all open pages.
12. Before login/After login
  1. Before login: Preview the page as when the customers have not logged in.
  1. After login: Preview the page as when the customers have logged in.
13. Screen modes
  1. There are three types of screen mode: Screen view, Split view, and HTML.
  1. 1) Screen view
  • You can edit the page while previewing the changes on the page.
  • When you move the cursor, the content on the page will be selected by module. You can click Edit for the area to edit to change the theme/settings.
  • The preview immediately reflects the changes.
    1. • This is only a preview. You must save the changes to apply them.
    1. • Add module function is not supported in the screen view mode, and it will be disabled during this mode.
  1. 2) Split view
  • You can edit the page while the screen is divided into two parts - Screen view and HTML mode.
  • The screen is split into half where you can use the screen view mode on the top and the HTML mode on the bottom.
  • When you select the area to edit in the screen view, the source for the selected area will be highlighted in the HTML mode.
  • You can edit the source in the HTML mode and click Preview on top to see the changes applied in the Screen view section.
  1. 3) HTML view
  • The HTML sources for the page to edit will appear for you to directly revise the codes.
  • Those who can write HTML can directly make changes. Editing has become more convenient with the module code assistance feature.
    1. • After editing the source, you need the change the mode to ‘screen view’ or ‘split view’ to see the changes made to the page.