How do I store a custom user selected CSS template style (like wordpress visual editor)? [closed]

by

If you want to give users the ability to style a few HTML elements on different sections of your website, the simplest implementation is the following:

1) Create table users_styles with fields: 

id (INT), user_id (INT), section_id (INT), value (VARCHAR 1000).

The value field will contain a string with the values of styles in the JSON format. Don’t forget about indexes.

2) Add constants of the style types in your PHP class, for example:

class UserStyle extends Model {

    const JOURNAL_COVER = 1;
    const FONT_NAME = 2;
    const FONT_SIZE = 3;
    const PAGE_THEME = 4;
    const PAD_THEME = 5;
    const BACKGROUND_COLOR = 6;
    // ...
}

Constants for sections:

class SiteSection extends Model {

    const MAIN = 1;
    const BLOG = 2;
    const CALENDAR = 3;
    // ...
}

3) Select types and values for the current user with the next query:

SELECT value
FROM users_styles
WHERE user_id = (int)$currentUserId
      AND section_id = (int)SiteSection::MAIN

You’ll get a string like this:

$userStyles = {"1":"sand.jpg","2":"water.jpg","3":"fire.jpg","4":"#EFEFEF","5":"Lora","6":"17px"};

After json_decode($userStyles, true); it will contain the next values:

[
    1=>'sand.jpg',
    2=>'water.jpg',
    3=>'fire.jpg',
    4=>'#EFEFEF',
    5=>'Lora',
    6=>'17px'
];

4) Insert styles as internal styles in the corresponding section template with the selected data. For example:

<style type="text/css">
body {
    font-family: "<?= $userStyles[UserStyle::FONT_NAME] ?>", serif !important;
    font-size: <?= $userStyles[UserStyle::FONT_SIZE] ?>px !important;
    background-color: #<?= $userStyles[UserStyle::BACKGROUND_COLOR] ?> !important;
}

#journal-cover {
    background-image: url("<?= $currentUserStylesFilesDirPath.$userStyles[UserStyle::JOURNAL_COVER] ?>") !important;
}

#pad-theme {
    background-image: url("<?= currentUserStylesFilesDirPath.$userStyles[UserStyle::PAD_THEME] ?>") !important;
}
<style>

This rules will rewrite all relevant rules for the styles of the body, #journal-cover and #pad-theme elements.

More Related Contents:

  1. Getting links from db and displaying them in another div [closed]
  2. Laravel one to many relation with a one to one relation
  3. PDOException SQLSTATE[HY000] [2002] No such file or directory
  4. How to do this in Laravel, subquery where in
  5. Laravel 5 PDOException Could Not Find Driver
  6. How to join three table by laravel eloquent model
  7. Laravel 5.2 – Use a String as a Custom Primary Key for Eloquent Table becomes 0
  8. Setting up Laravel on a Mac php artisan migrate error: No such file or directory [duplicate]
  9. Laravel 5.4 field doesn’t have a default value
  10. “No such file or directory” or “No such host is known” when running migrations
  11. Laravel $q->where() between dates
  12. belongsToMany relationship in Laravel across multiple databases
  13. How Can I Set the Default Value of a Timestamp Column to the Current Timestamp with Laravel Migrations?
  14. Laravel 5.4 on PHP 7.0: PDO Exception – Could not find driver (MySQL)
  15. Laravel nested relationships
  16. getting the value of an extra pivot table column laravel
  17. Laravel Cannot delete or update a parent row: a foreign key constraint fails
  18. php artisan migrate throwing [PDO Exception] Could not find driver – Using Laravel
  19. Change name of Laravel’s created_at and updated_at
  20. Base table or view not found: 1146 Table Laravel 5
  21. SQLSTATE[HY000] [2002] php_network_getaddresses: getaddrinfo failed: nodename nor servname provided, or not known
  22. How do I get database column names in Laravel?
  23. Laravel SQLSTATE[HY000] [2002] Connection refused
  24. Eloquent many-to-many-to-many – how to load distant relation easily
  25. Mysql InnoDB engine in Laravel
  26. PHP Laravel: No connection could be made because the target machine actively refused it
  27. How to create a database-driven multi-level navigation menu using Laravel
  28. Eloquent groupBy make “SQLSTATE[42000]” with valid SQL query in Laravel 5.3
  29. Check if laravel model got saved or query got executed
  30. find in set in laravel ? example

Leave a Comment