Read also on our blog
-
PrestaShop child theme: customise the design without losing changes when you update If you edit your theme's files directly, the next update wipes out your changes. A child theme holds only what you change and inherits the r Read article → -
Twig and Smarty in PrestaShop: what is used where and how to customise without breaking things The front office still uses Smarty and the back office uses Twig. We explain how to customise each one and where to put your changes so they Read article → -
The PrestaShop console: bin/console commands that save you hours Install, upgrade and reset modules, clear the cache or check routes without opening the back office. A PrestaShop console cheat sheet, traps Read article →
tpl js and css editor module
Price:
€60.50
This product can be bought as a subscription. Below you can see what each option includes and what it costs.
First year:
€60.50
tax incl.
From the second year:
€15.13/year
tax incl.
- One year of technical support and lifetime updates; from the second year, support is extended for €15.13/year and includes taking on your general improvement ideas for the module.
- Renews automatically; cancel whenever you want, with no minimum term.
One-time payment:
€60.50
tax incl.
- One year of technical support and lifetime updates; after that, support ends (with the subscription it is extended for €15.13/year).
- A single payment, with no automatic charges.
€50.00
+ VAT = €60.50
Edit your theme's CSS and JS from the back office, without FTP: one-click access to custom.css and custom.js, syntax highlighting, search across all files, automatic backup before each save, and protection against overwriting changed files on disk. Compatible with PrestaShop 8 and 9.
Design
Changing a color shouldn't require an FTP client.
A bit of extra margin, a button that doesn't stand out, a tracking script that needs to be pasted. It's just two lines of code, but writing them requires server access, knowing where the file is located, and praying you don't break anything. RKR Theme CSS/JS Editor lets you do this from the back office, with a backup before each save.
1 click
Even
custom.css or custom.js . If your theme doesn't have them, the editor offers to create them, and PrestaShop loads them automatically. 20 copies
By file, by default, and by adjustable settings. Each save creates a copy of the previous state, and to revert to it, you select it from a drop-down menu.
0 PHP files
Only edit CSS, JS, SCSS, and LESS within the theme folder. No core, modules, or configuration.
A real editor, not a text box
Syntax highlighting, line numbers, and saving with Ctrl+S . On the left, you'll find all the theme's editable files with their sizes and a filter to find the one you're looking for; custom files always appear at the top. If you close the tab with changes without saving, you'll be notified.
If your back office does not have internet access, highlighting is disabled and the editor continues to function as plain text.
Search throughout the theme
Where is ` .product-miniature defined? Type it in, and you'll see each match with its file and line number. Press one, and the editor opens the file right there. It supports case sensitivity, regular expressions, and filtering by CSS or JS.
Within the open file, you also have the search and replace option. The replacement is done in the editor and doesn't affect the disk until you save, so it can be disregarded.
If something goes wrong, it falls apart.
Each save creates a copy of the file's state. You choose one from the dropdown menu, load it into the editor, review it, and save. Discarding changes reverts to the original state on disk at any time.
And if someone else—or your developer via FTP—has changed the file since you opened it, the editor refuses to save and prompts you to reload it. No one inadvertently overwrites anyone else's work.
The change is visible immediately.
With the "Clear cache on save" option, the module clears the combined CSS and JS cache of both the theme and the templates. Your changes will appear in the store even if you have PrestaShop file optimization enabled, which is precisely why a manual change doesn't appear and the reason is unknown.
The concern: security
A back-office file editor needs to be strict, and this one is:
- It only works within
/themes/Paths with.., symbolic links, or external files are rejected on the server. - Closed list of extensions: CSS, JS, SCSS, and LESS. Never PHP.
- Limited to the default SuperAdmin profile, and also subject to the tab permissions.
- Each save is recorded: date, employee, IP address, file, and content fingerprint.
- The
.tpltemplate editing feature exists, but it is disabled by default and is only used by a SuperAdmin, with a mandatory backup before each save.
Compatibility
PrestaShop 8.0 to 9.x. Tested on PrestaShop 8.2 with Classic and on 9.2 with Hummingbird, with PHP 8.1 and 8.3. Works with any theme, including child themes. No overrides and no kernel modifications.
-
Brand
v1.2.1
- Search tool fix: It was failing to search within the theme files.
You might also like
4 other products in the same category
- New
RKR Product Feed for Google, Meta and TikTok: one item per combination, with its price and stock
€96.68
€79.90
+ VAT = €96.68
Viewed products
También podría interesarte
€80.95
€66.90
+ VAT = €80.95
€80.95
€66.90
+ VAT = €80.95
€80.95
€66.90
+ VAT = €80.95
€84.69
€69.99
+ VAT = €84.69
€120.99
€99.99
+ VAT = €120.99
€80.95
€66.90
+ VAT = €80.95
€80.95
€66.90
+ VAT = €80.95
€302.50
€250.00
+ VAT = €302.50
€181.50
€150.00
+ VAT = €181.50
Questions and answers
-
¿Qué archivos puedo editar con el módulo?
0-
Solo CSS, JS, SCSS y LESS dentro de la carpeta del theme, nunca PHP; ni el núcleo, ni módulos, ni configuración. custom.css y custom.js están a un clic, y si tu theme no los tiene el editor te ofrece crearlos. La edición de plantillas .tpl existe, pero viene apagada y solo la usa un SuperAdmin.
-
-
¿Y si rompo algo al guardar?
0-
Cada guardado hace antes una copia del estado anterior: 20 por archivo de serie, ajustables. Eliges una en el desplegable, la cargas en el editor, la revisas y guardas. También puedes descartar los cambios y volver a lo que hay en disco.
-
-
¿Qué empleados pueden usarlo?
0-
De serie, solo el perfil SuperAdmin, y además sujeto a los permisos de la pestaña. Cada guardado queda registrado con fecha, empleado, IP, archivo y huella del contenido, y las rutas fuera de /themes/tu-tema se rechazan en el servidor.
-
-
Tengo activada la optimización de CSS y JS de PrestaShop. ¿Se verán mis cambios?
0-
Sí, si activas la opción de vaciar caché al guardar: el módulo limpia la caché de CSS y JS combinados del theme y la de plantillas, para que el cambio llegue a la tienda.
-
-
¿Qué pasa si mi desarrollador cambia el mismo archivo por FTP?
0-
Si el archivo ha cambiado en disco desde que lo abriste, el editor se niega a guardar y te pide recargarlo. Así nadie pisa el trabajo de otro sin darse cuenta.
-
-
¿Funciona con mi theme y con qué versiones de PrestaShop?
0-
Funciona con cualquier theme, incluidos los temas hijo, sin overrides ni tocar el núcleo. Es compatible con PrestaShop 8.0 a 9.x; probado en 8.2 con Classic y en 9.2 con Hummingbird, con PHP 8.1 y 8.3.
-
