Import and Export of Layouts and CSS files

Introduction

• Import and Export of Layouts enable sharing of layouts between users.  The exported files are an xml file, for example exported_layout_jd_3.9.8_Compact_Files_Layout_v3.9.xml.
• Import and Export of CSS files is to facilitate making changes to the appearance of the items in the layout.  The exported files are a css file, for example jdownloads_custom.css.

1. jdownloads_fe. css which is the main styling of the front end; - this file is liable to be reset on every jDownloads update
2. jdownloads_fe_rtl.css which is used when a RTL language is in use;
3. jdownloads_buttons.css which styles the buttons;
4. jdownloads_custom.css which is specific to your site and is not changed by jDownloads;
5. jdownloads_modules.css which is used with most jDownloads modules.
   
   NOTE: All of the CSS files, except jdownloads_custom.css, are is liable to be reset on every jDownloads update.

• Import is uploading to your site,
• Export is transferring from your site to your local device, that is downloading.

To access the import and export facilities go to the jDownloads Control Panel and click on the button.  The Main Layouts Header Bar, as shown below, has both Import and Export CSS buttons together with an Import Layout button.
Main Layouts Header Bar
The button is in the individual layouts.

Notes (i)The layout files are exported and imported as '.xml' files because they have multiple sections. 
(ii)The css files are exported and imported as type '.css' files.

For reference the main jDownloads Control Panel is shown opposite immediately to the right,

and the Layout Type Selection Panel is shown on the far right.

jDownloads Control Panel
 Layout Type Selection Panel

Export a Layout

Click on the button on the JDownloads Control Panel and then select Export from the Main Layouts Header Bar
To export a layout you first need to select the type of layout on the Layout Type Selection Panel, for example to export one of the Downloads layout  click on the button.

This will then list all the layouts of that type.

Next 'tick' the select box of the actual layout.  In this example it is a layout called 'Compact Layout 3.9'.

Then click on the button on the tool bar at the top of the page.

Import a Layout

Click on the button on the JDownloads Control Panel and then select the  from the Main Layouts Header Bar
After clicking on the the Import layout button on the header bar  of the Layout Control Panel and also in each individual layout section.  The imported xml file contains the type of layout so jDownloads knows into which section the uploaded layout file is to be located.

Checks are made upon the structure and contents of the uploaded xml file to ensure it is a valid layout file.

Click on the Browse button to find the xml file, and then click on the Import Layout button.

Export a CSS file

Clicking on the Export CSS file button on the header baro Layout Control panel, the Layout Export page will be shown.

After some explanation about the five CSS files there will be a Select button and an export button.  Usually it will be the jdownloads_custom.css files that is selected.

Next click on the Export CSS button next to the Selection button. This will open up a standard download sequence in your browser so that you can save the exported css file to a location of your choice.  In this example the name of the exported file is jdownloads_custom.css

Import a CSS file

The 'Import a CSS file' button is only available on the Layout Type Selection Panel.  Clicking on the 'Import CSS file' button will take you to the import css page.

After some explanation about the five CSS files there will be a Browse button and an Import CSS file button.  First use the Browse button to locate the required CSS file on your local deviceThis is uploaded from your local device to the web site.

Use the Browse button to select the particular file to upload to your site, then click the  button.

Note that jDownloads makes several checks on the validity of the selected file.

The picture opposite shows a view of the web site files before the import occured.

Note that jDownloads also supports the  w3schools (opens in a new tab/window) w3.css file.  This is a modern CSS framework with built-in responsiveness. It supports responsive mobile first design by default, and it is smaller and faster than similar CSS frameworks.

If the upload is successful then the new file will be in the directory and the previous file will have been renamed.

In this example the renamed file is "jdownloads_custom.css.backup.1"
If another upload of a "jdownloads_custom.css" file occurs then there will another backup file, this time called "jdownloads_custom.css.backup.2".

This succesive naming continues. To delete a backup file or rename back to  "jdownloads.fe.css" it is necessary to use either a Joomla! file manager, an FTP programme or the website control panel file manager.

If the upload is not successful then an error message is returned and the directory remains unchanged