Connecting css in MVC system in PHP?

D

Dom Alfro2019-11-15 11:07:49

PHP

Dom Alfro, 2019-11-15 11:07:49

Hello !
I have such a problem, I don’t know what to do - I have a main template (default.php)
There are certain styles (css) for it, but there are certain styles (css) for other pages.
But if I connect them to one main template, then a mess is formed.
And how can I connect them separately if my styles are connected through the main template?
There is an idea to write a page check script and include styles if the page is defined - but I have no idea how to implement this ...

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

F

FanatPHP, 2019-11-15
@mustang_shelby

Use the normal templating engine, Twig.
First, you make the main site template and define changeable blocks in it. The most important, of course, will be an empty content block - where the output of individual pages will go.
You also make blocks for scripts and styles.
General site styles are defined in the style block.
Next, you make templates for specific pages that inherit the main template, and in which the content block is filled.
At the same time, the style block is expanded with the styles needed specifically for this page.
Thus, the vinaigrette so familiar to bydlokoders will not work.
Any styles will lie only in the templates, and will not clog other MVC elements.
In this case, the main template will not be clogged. unnecessary links.
I understand that without an example it is difficult.
Here is the simplest example of what I wrote above:
main.twig.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
{% block stylesheets %}
    <link href="/css/main.css" rel="stylesheet">
{% endblock %}
        <title>{% block title %}Twig Example{% endblock %}</title>
    </head>
    <body>
        {% block content %}{% endblock %}
    </body>
</html>

index.twig.html

{% extends "main.twig.html" %}

{% block content %}
<h1> index page </h1>
<li><a href=/page1.php>Page 1</a>
<li><a href=/page2.php>Page 2</a>
{% endblock %}

page1.twig.html

{% extends "main.twig.html" %}

{% block stylesheets %}
    {{ parent() }}
    <link href="/css/page1.css" rel="stylesheet">
{% endblock %}

{% block title %}Page 1{% endblock %}

{% block content %}
<h1> page 1</h1>
<li><a href=index.php>index</a>
{% endblock %}