Как добавить к <head>с PHP в середине страницы? - PullRequest
Новая
       42

Как добавить к <head>с PHP в середине страницы?

0 голосов
/ 29 октября 2019

У меня есть «кусок» кода HTML с HTML и JS , так что я мог бы легко включить его с PHP . Я также хочу, чтобы он имел стиль CSS , но в соответствии со стандартами вы не можете " " делать это - пока он работает, он делает страницу недействительной. CSS допускается только в <head> и не в середине страницы (по крайней мере, до HTML5.2). Поэтому я подумал добавить в заголовок файл с аналогичным именем, но отдельный файл .css, но с PHP и , а не JS (для повышения производительности) 

<head>
<!-- PHP needs to include button.css here AFTER $App->INC("button"); has been called -->
</head>

<body>
<?php
$App->INC("button");
//This basically does 'require_once("button")';
//What do I need to add to the INC method to include css file in the head?
//Similar to $("head").append() but with PHP
?>
</body>

файл css с тем же именем должен бытьдобавлено в раздел <head>.

PS : Это может показаться недостатком дизайна, а может быть и так, но здесь стоит мысль.

  1. У меня есть фрагмент кода, который при включении в нужном месте тела создает «загрузочный экран» (или другие элементы пользовательского интерфейса, которые не могут / не должны быть вложены нигде, кроме как в <body> веб-сайта.
  2. У него есть стиль в отдельном файле
  3. Я отправляю его другому пользователю
  4. Они включают его в метод класса "App", который выполняет только две вещи: включаетсам файл и css файл рядом
  5. Затем они используют только 1 строку кода, чтобы поместить его туда, куда они хотят, а не в 2-3 других местах, чтобы код был более управляемым

Пример:

Structure

Ответы [ 2 ]

0 голосов
/ 29 октября 2019

Если вы включаете CSS непосредственно в сам компонент или ожидаете, что компонент будет динамически загружать соответствующий CSS, то это может быть довольно сложно поддерживать или настраивать. Я не говорю, что вы не должны идти по этому пути, но будьте осторожны, прося ваши компоненты делать слишком много.

Система хуков, как указано в комментариях, является одним из способов справиться с этим.

Другим простым способом является предоставление стиля по умолчанию, который пользователи могут переопределять. Вероятно, это самый простой способ разрешить разные стили для каждого компонента. 

<head>
<!-- Provide some defaults. Users should not customize this one. -->
<link rel="stylesheet" type="text/css" href="default.css">

<!-- User's can customize this file to override the default styling.-->
<link rel="stylesheet" type="text/css" href="custom.css">
</head>

<body>
<?php $App->INC("button"); ?>
</body>

button.php - отвечает только за рендеринг кнопки. Отдельные CSS-файлы будут фактически стилизовать его. 

<?php
echo <input type"submit" class="button" value="Submit">

default.css - применяет стиль по умолчанию 

.button {
    color: blue;
}

custom.css - переопределяет стиль по умолчанию 

.button {
    color: red;
}

Последнее замечание, вы также можете захотеть использовать основной файл шаблона, который наследуют вложенные представления. Это помогает уменьшить количество полных файлов HTML, которые ссылаются на ваши файлы CSS. Идея состоит в том, чтобы иметь 1 (или несколько) файлов шаблонов, в которые сами представления внедряются. Вот немного псевдокода.

frontend.php 

<html>
<head>
<!-- Links to CSS files here. -->
</head>

<body>
<?php $placeholder('body'); ?>
</body>

Login.php 

<?php inherits('frontend.php')->body; ?>
<form id="login">
...

Register.php 

<?php inherits('frontend.php')->body; ?>
<form id="register">
...

About-Us.php 

<?php inherits('frontend.php')->body; ?>
<p>About Us</p>
...
0 голосов
/ 29 октября 2019

Вы можете попробовать это: 

<?php
ob_start();
$App->INC("button");
$button = ob_get_clean();
?>
<head>
<!-- Do your inclue here -->
</head>

<body>
<?= $button ?>
</body>

Вы можете поместить материал ob_start() / ob_get_clean() в button.php и вернуть содержимое с помощью метода INC(). Затем вы можете сохранить содержимое непосредственно в $button следующим образом: $button = $App->INC("button");.

Но ваш пример выглядит как проблема дизайна. Однако я надеюсь, что это поможет.

Это может быть возможным редизайн: 

<?php

$App->loadModule('button'); // Loads the module, the module registers stylesheets and content.

$App->loadModule('another_module'); // Load more modules ...

<head>
<?php $App->renderModuleStylesheets(); ?>
</head>

<body>
<?php $App->renderModuleContent(); ?>
</body>
...