02-15-2022, 04:27 PM
(Última modificación: 02-15-2022, 04:30 PM por Miguel92.
Razón: Olvide enlace para descargar ajax.css.php
)
5
![Mejor respuesta del mensaje [MOD] Editor de CSS en Admin 3](images/thx/star.png)
Editar CSS desde la administración 3
En esta versión se creará una copia de seguridad, pero una vez que hayas realizado el cambio y quieras volver a editar se sobrescribirá la copia de seguridad por el nuevo contenido.
Básicamente esto es una actualización, pero no requiere que tengas este mod instalado... Ya que se puede hacer instalar cero
1 - Ir a tu-tema/js/admin.js y debajo de todo agregar
Código: ( Seleccionar Todo )
/**
* Editar CSS
* Versión 14.02.2022
*/
$(document).ready(() => $("#opciones").on('change', e => $("#mostrarCss").val(e.target.value)))
var editar_css = new function() {
this.editar = () => {
var fileCss = $('input[name=archivo_css]').val();
if(this.verificar_archivo(fileCss)) {
$.post(global_data.url + '/css-editar.php', 'css=' + fileCss, h => {
$("textarea[name=editar_css]").html(h)
.css({
width: '100%',
height: '500px',
resize: 'vertical'
})
$("textarea[name=editar_css], button[name=guardar_css]").show();
})
}
},
this.guardar = () => {
var params = [
'name=' + $('input[name=archivo_css]').val(),
'contenido=' + $('textarea[name=editar_css]').val()
].join('&')
$.post(global_data.url + '/css-guardar.php', params, h => {
mydialog.show();
mydialog.title('Guardado...');
mydialog.body('Los cambios fueron aplicados');
/**
* Si realizaste este cambio Registrate o inicia tu sesión para ver este contenido
mydialog.buttons([
{mostrar:true,texto:'Aceptar',accion:'admincss()',activo:true},
{mostrar:true,texto:'Cancelar',accion:'cerrar',accion:true}
]);
*/
mydialog.buttons(true, true, 'Aceptar', 'admincss()', true, false, true, 'Cancelar', 'close', true, true);
mydialog.center();
})
},
this.verificar_archivo = filename => {
var ext = (/[.]/.exec(filename)) ? /[^.]+$/.exec(filename.toLowerCase()) : '';
if(ext && /^(css)$/.test(ext)) return true;
else return false;
}
}
// Retorna
admincss = () => location.href = global_data.url + '/admin/css'2 - Ir a templates/t.admin.tpl y buscamos
Código: ( Seleccionar Todo )
{elseif $tsAction == 'rangos'}
{include file='admin_mods/m.admin_rangos.tpl'}debajo de agregamos
Código: ( Seleccionar Todo )
{elseif $tsAction == 'css'}
{include file='admin_mods/m.admin_css.tpl'}3 - Ir a templates/admin_mods/ y crear un archivo llamado m.admin_css.tpl y agregar lo siguiente (Lo pueden adaptar a su theme)
Código: ( Seleccionar Todo )
<style>
#opciones {
padding: 2px;
}
#opciones > option {
padding: 2px;
margin-bottom: 4px;
}
</style>
<div class="boxy-title">
<h3>Editar CSS</h3>
</div>
<div id="res" class="boxy-content">
<span class="mensajes error">Seleccione un archivo, si no se encuentra escríbalo!</span>
<div style="display:grid;gap:10px;grid-template-columns: 200px 1fr;">
<div>
<select id="opciones" size="10">
<option value=''>Selecciona un archivo</option>
{foreach $tsListaCSS item=css}
<option value="{$css.file_name}">{$css.name}</option>
{/foreach}
</select>
</div>
<div >
<div style="display: flex;">
<input type="text" name="archivo_css" id="mostrarCss" placeholder="Ej: estilo.css o css/admin.css" size="15"/>
<button class="mBtn btnOk" style="width:120px;margin-left: 10px;" onclick="editar_css.editar(); return false;">Editar</button>
</div>
<textarea name="editar_css" placeholder="El contenido del css se mostrará aquí" style="margin:10px 0;display: none;"></textarea>
<button class="mBtn btnPrimary" onclick="editar_css.guardar(); return false;" name="guardar_css" style="display: none;">Guardar</button>
</div>
</div>
</div>4 - En la misma carpeta buscan m.admin_sidemenu.tpl y buscan
Código: ( Seleccionar Todo )
<li id="a_temas"><span class="cat-title"><a href="{$tsConfig.url}/admin/temas">Temas y apariencia</a></span></li>y agregan
Código: ( Seleccionar Todo )
<li id="a_rangos"><span class="cat-title"><a href="{$tsConfig.url}/admin/css">Editar CSS</a></span></li>5 - Luego van a inc/php/admin.php y buscan
Código PHP: ( Seleccionar Todo )
} elseif($action == 'medals') {
y arriba agregan
Código PHP: ( Seleccionar Todo )
# EDITAR CSS
} elseif($action == 'css') {
$smarty->assign('tsListaCSS', $tsAdmin->obtenemos_css());
6 - Después en inc/class/c.admin.php buscan
Código PHP: ( Seleccionar Todo )
/*
saveAds()
*/
function saveAds()
y arriba agregan, para que funcione bien, tiene que haber realizado Debes agradecer para ver el contenido...
Código PHP: ( Seleccionar Todo )
/**
* EDITAR CSS
*/
public function obtenemos_css() {
global $smarty;
# Solo será esta extensión
$ext = 'css';
# Definimos una variable para crear un arreglo
$lista_css = [];
# Ahora buscaremos todos los css existentes
$dir_css = opendir( $smarty->template_dir["tema"] );
# Recorremos todas las carpetas
while ($style = readdir($dir_css)) {
if($style === '.' || $style === '..') continue;
if(is_file($smarty->template_dir["tema"] . $style)) {
preg_match_all('/([a-zA-Z0-9_-]+\.(css))/', $style, $css);
$file_css = $css[1][0];
if($file_css !== NULL) {
array_push($lista_css, [
'name' => ucfirst(substr($file_css, 0, -4)),
'file_name' => $file_css
]);
}
}
if (is_dir($smarty->template_dir["tema"] . $style)) {
if($style === $ext) {
$carpeta_css = opendir( $smarty->template_dir["tema"] . $ext );
while ($style = readdir($carpeta_css)) {
if($style === '.' || $style === '..') continue;
array_push($lista_css, [
'name' => ucfirst(substr($style, 0, -4)),
'file_name' => $style
]);
}
closedir( $carpeta_css );
}
}
}
closedir( $dir_css );
return $lista_css;
}
7 - Por último van a inc/php/ajax y crean un archivo llamado ajax.css.php y pegan esto o Debes agradecer para ver el contenido..., en caso que no se cree la carpeta "css_backup", deberán crearla manualmente en files/uploads/ y darle los permisos de escritura 0777
Código PHP: ( Seleccionar Todo )
<?php if ( ! defined('TS_HEADER')) exit('No se permite el acceso directo al script');
/**
* Controlador AJAX
*
* @name ajax.css.php
* @author Miguel92
*/
/**********************************\
* (VARIABLES POR DEFAULT) *
\*********************************/
// NIVELES DE ACCESO Y PLANTILLAS DE CADA ACCIÓN
$files = [
'css-editar' => ['n' => 2, 'p' => ''],
'css-guardar' => ['n' => 2, 'p' => ''],
];
/**********************************\
* (VARIABLES LOCALES ESTE ARCHIVO) *
\*********************************/
// REDEFINIR VARIABLES
$tsPage = 'ajax/p.css.'.$files[$action]['p'];
$tsLevel = $files[$action]['n'];
$tsAjax = empty($files[$action]['p']) ? 1 : 0;
/**********************************\
* (INSTRUCCIONES DE CODIGO) *
\*********************************/
// DEPENDE EL NIVEL
$tsLevelMsg = $tsCore->setLevel($tsLevel, true);
if($tsLevelMsg != 1) { echo '0: '.$tsLevelMsg; die();}
/**
* Creamos la carpeta "css_backup" para almacenar las copias
*/
$backups = "../../files/uploads/css_backup";
if(!is_dir($backups)) {
mkdir($backups);
chmod($backups, 0777);
}
$myBackUp = $backups . '/$1-backup.css';
switch($action){
case 'css-editar':
$file_css = $tsCore->setSecure($_POST['css'], true);
$notExt = substr($file_css, 0, -4);
if(file_exists($smarty->template_dir["tema"] . $file_css)) {
$css = file_get_contents($smarty->template_dir["tema"] . $file_css);
# Creamos un backup, solo por seguridad
file_put_contents(str_replace('$1', $notExt, $myBackUp), $css);
echo $css;
} elseif(file_exists($smarty->template_dir["css"] . $file_css)) {
$css = file_get_contents($smarty->template_dir["css"] . $file_css);
# Creamos un backup, solo por seguridad
file_put_contents(str_replace('$1', $notExt, $myBackUp), $css);
echo $css;
} else echo 'Error: el archivo no existe';
break;
case 'css-guardar':
$nombre = $tsCore->setSecure($_POST["name"]);
$contenido = $_POST['contenido'];
$contenido = str_replace(
['\\n', "'", '"'],
['\n', "'", '"'],
$contenido
);
$dir = (file_exists($smarty->template_dir["tema"] . $nombre)) ? "tema" : "css";
$css = $smarty->template_dir[$dir] . $nombre;
file_put_contents($css, $contenido);
break;
}
y eso sería todo, espero no haberme olvidado de algún paso.
Facebook
Twitter
Reddit
Digg
del.icio.us
Tumblr
Pinterest
Blogger
Fark
LinkedIn
Mix
Google