Добро пожаловать на демо-страницу CSSE!

CSSE - библиотека для редактирования CSS сайта онлайн по принципу WYSIWYG (What You See Is What You Get).
Вы можете посмотреть, как это работает, прямо на этой странице. :-)
Идея проста: в отдельный CSS выносим все стили, которые можно редактировать.
CSS файл парсится, в результате строится форма редактирования.
Библиотека написана на PHP, JavaScript, в стиле ООП, с использованием Jquery и Ajax. База данных не нужна.

Для чего нужна CSSE:

  • В конструкторах сайтов.
  • Пользователи художественного портала, социальной сети, форума могут настраивать его внешний вид каждый на свой вкус.
  • Наглядная демонстрация того, как работает CSS, в учебных целях.
  • Быстрое макетирование дизайна при обсуждении с заказчиками, отладка CSS для администраторов и т.д.

Особенности:

  • Все значения форм валидируются, гарантируя целостность CSS.
  • CSS файл кешируется, благодаря чему нет надобности парсить его каждый раз (кеширование можно отключить для отладки).
  • Комментарии в CSS могут использоваться в качестве понятных пользователю заголовков - названий селекторов - в форме редактирования.
  • Мультилингвальность интерфейса.
  • CSSE распространяется по свободной лицензии MIT.
  • CSSE предельно проста и минималистична. PHP код - 20Кб, JavaScript - 170Кб, где 160Кб занимает Jquery.
  • CSSE легко настраивается и интегрируется в ваш проект, а также легко дополняется новыми типами полей.
  • Тестировалось в Firefox 3.5, Opera 9, Google Chrome, IE6, IE7, IE8.

Пример CSS этой страницы:

	body {
		color: #000000;
	}

	/* CSSE_SPAN_CSSE */
	span.csse_name {
		color: #0019f5;
	}

	/* CSSE_DIV_ABOUT */
	div.about {
		border-bottom-width: 1px;
		border-bottom-style: dashed;
		border-bottom-color: #ccc;
	}

	/*
	   CSSE_DIV_HEADER
	*/
	h3 {
		font-size: 17pt;
		padding: 3px;
		color: #f9ff4c;
		background-color: #1f7519;
	}
	

Пример использования:

<?php
    
// Constants from CSS in English
    
define('CSSE_SPAN_CSSE',        'CSSE title');
    
define('CSSE_DIV_ABOUT',        'Paragraph');
    
define('CSSE_DIV_HEADER',        'Header');

    
// Show edit form
    
require('csse/csse_request.php');
    
CSSE_Request::edit('css/edit.css');
?>

Архитектура CSSE:

Скачать:

Версия 0.9

Автор:

Copyright (©) 2009 Павел Гуданец
инСайт Павла
Библиотека написана за 6 часов 2009.11.20.
CSS Editor