css met php combineren - Softwareontwikkeling

donderdag 21 januari 2010 18:20

Acties:

0 Henk 'm!

Topicstarter

hallo allemaal,

Ik ben vandaag begonnen met css (php kon ik al). ik heb dus wat oefeningetjes gedaan met de nieuwe programmeer taal en het ging wel goed. Ik heb een mouseover menuutje gemaakt maar ik wou er ook nog een leuke php functie in stoppen. Dat heb ik dus gedaan maar als index.html runt geen browser php:S dus savede ik em naar index.php. Je raadt het al: CSS doet et niet!

Dit heb ik geprobeerd:

- inplaats van het hele script in het bestand heb ik zo'n verwijzertje naar style.css erin gedaan, hielp niet!
-de vorige en de oorspronkelijke manier met behulp van php -> (dus <?php echo("style spullen"); ?> ) alle 2 geen resultaat.

Ik ben beginner en heb op google gezocht maar het werkt allemaal dus niet! hieronder het script: (let niet op de amateuristche wijze van programmeren)

index.php:

PHP:

<?php
if (!empty($_POST)){
$achtergrond=$_POST["plaatje"];
}
else {
$achtergrond="plaatje.jpg";
}
?>
<html>
<head>
<?php
//ik heb de css tags maar even weggehaald hier
?>
<title>Untitled</title>
</head>
<body background="<?php echo("$achtergrond"); ?>">
<?php //ik had eerst met css bij A een plaatje neergezet voor een menu, nu staat er dus niks in de browser ?>
<a href="index.php"></a><a href="index.php"></a><a href="index.php"></a><a href="index.php"></a><a href="index.php"></a>

<form method="POST" action="<?php echo($_SERVER["PHP_SELF"]);?>">
<p>Kies je achtergrond (website intypen)<input type="text" name="plaatje">
<input type="submit" name="submit">
</form>


</P>
</body>
</html>

en de style.css:

Cascading Stylesheet:

p {font-family:Calibri;
    font-size=13px;}
img
{
border-style: none;
text-decoration: none;
} 
a:hover, a:active {
            width: 273px;
            height: 137px;
            background: url(plaatje.png) center no-repeat;
        }
a {
            width: 273px;
            height: 137px;
            background: url(plaatje2.png) center no-repeat;

Weet iemand hoe ik dit kan oplossen? ik snap et namelijk niet meer

donderdag 21 januari 2010 18:26

Acties:

0 Henk 'm!

Manuel

Leuk dat je net bent begonnen maar ik raad je aan om hier de [php][/php] [code=css][/code] te gebruiken, zo wordt het voor ons ook overzichtelijker.

Verder als jij je CSS in PHP tags zet (nut?) moet je wel zorgen dat je alles echo'd en dat alles ook klopt.

[ Voor 1% gewijzigd door Manuel op 21-01-2010 18:27 . Reden: * ]

donderdag 21 januari 2010 18:30

Acties:

0 Henk 'm!

BasieP

de extentie .css wordt door apache niet doorgestuurd naar php en dus wordt er niks geparsed

ow wacht dit heeft helemaal niks met css te maken, het is gewoon een fout in php code

offtopic:

<a href="index.php"></a><a href="index.php"></a><a href="index.php"></a><a href="index.php"></a><a href="index.php"></a>

Mag ik die code als voorbeeld gebruiken in een ander topic?

[ Voor 69% gewijzigd door BasieP op 21-01-2010 18:33 ]

This message was sent on 100% recyclable electrons.

donderdag 21 januari 2010 19:00

Acties:

0 Henk 'm!

evanraalte

Topicstarter

@BasieP: Ja hoor mag wel;), tis alleen maar een slecht voorbeeld hoor, in de css wordt het ook verwezen naar een plaatje.
@Manuel: ik heb dat even expres gedaan maar daar gaat het nu niet om, ik heb de code gewijzigd

[ Voor 38% gewijzigd door evanraalte op 21-01-2010 19:05 ]

donderdag 21 januari 2010 19:03

Acties:

0 Henk 'm!

Lennart_1337

BasieP schreef op donderdag 21 januari 2010 @ 18:30:
Mag ik die code als voorbeeld gebruiken in een ander topic?

Vertel dan ook even waar het heengaat, want ik heb al zo'n idee...

En CSS is geen echte programmeer taal, het heet voluit ook wel: Cascading Style Sheet

Leuk dat je er mee begonnen bent, zelf heb ik veel aan deze site gehad: Tizag tutorials
Staan ook goede tutorials over HTML/PHP/Javascript etc.

[ Voor 21% gewijzigd door Lennart_1337 op 21-01-2010 19:06 ]

donderdag 21 januari 2010 19:09

Acties:

0 Henk 'm!

Joolee

Wat werkt er niet? Zet eens een voorbeeldje online, dan kunnen we zien wat je nu precies aan het proberen bent.

Ik snap trouwens ook niet wat CSS en PHP met elkaar te maken hebben. PHP is een programmeertaal, deze wordt op de server uitgevoerd en het resultaat (vaak HTML+CSS+Javascript) wordt naar de browser gestuurd. In de browser wordt de HTML geïnterpreteerd en wordt de CSS stijl toegepast op de HTML code.

Als je dus een PHP pagina bezoekt en je bekijkt de broncode zul je alleen de resulterende code zien. (Meestal dus HTML, CSS en Javascript)

[ Voor 14% gewijzigd door Joolee op 21-01-2010 19:10 ]

donderdag 21 januari 2010 19:11

Acties:

0 Henk 'm!

DeluxZ

Livin' the good life

<body background="<?php echo("$achtergrond"); ?>">

Hieruit maak ik op dat je op de body het plaatje wil veranderen via PHP.

probeer dan is body style="background-image:url(<?php echo $achtergrond; ?>);"

]|[ Apple Macbook Pro Retina 13" ]|[

donderdag 21 januari 2010 19:14

Acties:

0 Henk 'm!

DeluxZ

Livin' the good life

Je kan best via PHP een achtergrond laten veranderen hoor. Is echt een basis dingetje. Kijk is naar mijn comment hierboven en save je file gewoon als .PHP

evanraalte schreef op donderdag 21 januari 2010 @ 19:14:
@deluxZ: Ik wil het inderdaad veranderen, maar het liefst gewoon via mijn style.css bestand en niet via de regel zelf.

Zover ik kan weet kan je niks via PHP naar een .css bestand sturen om een bepaalde regel aan te passen. Dus gewoon zoals ik voorstelde doen.

Waarom zou je dat uberhaupt niet willen?

[ Voor 58% gewijzigd door DeluxZ op 21-01-2010 19:15 ]

]|[ Apple Macbook Pro Retina 13" ]|[

donderdag 21 januari 2010 19:15

Acties:

0 Henk 'm!

evanraalte

Topicstarter

Het php script doet het ook wel.
Alleen de CSS niet! dat bestand wat ook in mijn OP zit wordt niet herkent en ik zoek alleen maar een manier om die werkend te krijgen

en Ik ga niet voor elke regel hetzelfde willen, ik gewoon alles in dat ene style bestand, anders kost het op lange termijn echt heel veel tijd. Niet dat het met deze site nodig is, maar ik wil gewoon weten hoe het moet en dan het php gedeelte ook te laten werken.

[ Voor 44% gewijzigd door evanraalte op 21-01-2010 19:17 ]

donderdag 21 januari 2010 19:18

Acties:

0 Henk 'm!

DeluxZ

Livin' the good life

Tussen de <head> en </head> dit zetten

HTML:

1	<link rel="stylesheet" type="text/css" href="class.css">

]|[ Apple Macbook Pro Retina 13" ]|[

donderdag 21 januari 2010 19:19

Acties:

0 Henk 'm!

evanraalte

Topicstarter

Al geprobeerd, werkt niet. Ik heb het ook al geprobeerd met die zin tussen php tags, werkt ook niet, hij geeft geen foutmelding ofzo, het doet het gewoon niet (de css)

donderdag 21 januari 2010 19:20

Acties:

0 Henk 'm!

RaZ

Funky Cold Medina

Je moet ook wel naar je css-bestand linken in de HTML he.

HTML:

1	<link rel="stylesheet" type="text/css" href="style.css" >

Edit: /laat

[ Voor 6% gewijzigd door RaZ op 21-01-2010 19:21 ]

Ey!! Macarena \o/

donderdag 21 januari 2010 19:21

Acties:

0 Henk 'm!

evanraalte

Topicstarter

Hoe bedoel je? je plaatst deze toch altijd tussen de <head> en </head>? dat werkt in dit geval dus niet;)

donderdag 21 januari 2010 19:22

Acties:

0 Henk 'm!

DeluxZ

Livin' the good life

HTML:

<head>
<?php
//ik heb de css tags maar even weggehaald hier
?>
<title>Untitled</title>
</head>

NIET zo , maar

HTML:

<head>
<link rel="stylesheet" type="text/css" href="style.css">
<title>php en css</title>
</head>

]|[ Apple Macbook Pro Retina 13" ]|[

donderdag 21 januari 2010 19:23

Acties:

0 Henk 'm!

evanraalte

Topicstarter

Dat was het eerste wat ik heb gedaan, maar om even duidelijk te maken dat ik het al geprobeerd had heb ik die comment er maar even bij gezet, natuurlijk stond daar oorspronkelijk mijn css.

donderdag 21 januari 2010 19:25

Acties:

0 Henk 'm!

DeluxZ

Livin' the good life

Als je daar <link rel... > had staan haal dan die verdomde <?PHP erboven en ?> eronder is weg. Dat gaat nooit werken.

Misschien moet je maar even een voorbeeld online gaan gooien, want dit werkt niet echt.

]|[ Apple Macbook Pro Retina 13" ]|[

donderdag 21 januari 2010 19:27

Acties:

0 Henk 'm!

CodeCaster

Can I get uhm...

Post eens de volledige code die je nu hebt, en vertel wat "het niet doet". Zonder zinnige meldingen kunnen wij ook niks, behalve gokken. Mijn gok: je hebt op Windows een bestand genaamd "Style.css", en plaatst op je Linux-webserver het bestand "style.css". Behalve dat kan dit nog zo'n 30.000 oorzaken hebben, dus post de code die je gebruikt en vertel wat er niet aan werkt!

Daarnaast kun je zonder kunstgrepen geen PHP-code in CSS verwerken, omdat .CSS door Apache direct doorgegeven wordt naar de browser van de bezoeker, zonder daarbij de PHP-parser te passeren.

[ Voor 35% gewijzigd door CodeCaster op 21-01-2010 19:29 ]

https://oneerlijkewoz.nl
Op papier is hij aan het tekenen, maar in de praktijk...

donderdag 21 januari 2010 19:35

Acties:

0 Henk 'm!

mcDavid

evanraalte schreef op donderdag 21 januari 2010 @ 19:12:
. Maar als ik em als .html save werken alleen die functies en dus php niet. en als ik em als php save werkt alleen de php en html en dus niet de css.
Ik zal ff wat online posten om het te laten zien

Al save je hem als index.teletubbietijd, die CSS blijft gewoon werken hoor!

CodeCaster schreef op donderdag 21 januari 2010 @ 19:27:

Daarnaast kun je zonder kunstgrepen geen PHP-code in CSS verwerken, omdat .CSS door Apache direct doorgegeven wordt naar de browser van de bezoeker, zonder daarbij de PHP-parser te passeren.

Ook je css stylesheet mag je gewoon als .php opslaan als dat je beter uitkomt!

[ Voor 33% gewijzigd door mcDavid op 21-01-2010 19:37 ]

donderdag 21 januari 2010 19:36

Acties:

0 Henk 'm!

Smoonshine

Feyenoord!!

Als ik het goed begrijp wil je de waarden van je stylesheet laten afhangen van een php script. Een .css bestand zal nooit worden geïnterpreteerd als een php pagina. Het zal dus nooit gaan werken met class.css. Je zult daar dan class.php van moeten maken. Nu weet ik niet zeker of een php pagina als stylesheet gelinkt kan worden. Anders zul je je php stylesheet tussen <style></style> moeten zetten.

Dan krijg je zoiets in de bovenkant van je php pagina.

PHP:

<?
if ($_POST["background"]){
$background = "plaatje.gif"
} else {
$background = "plaatje2.gif";
}
?>

tussen <style></style> in je head zet je dan:

Cascading Stylesheet:

.class {
background: url(<?= $background ?>);
 
}

Op die manier kun je je stijl door php laten bepalen.

[ Voor 9% gewijzigd door Smoonshine op 21-01-2010 19:41 ]

uhm...

donderdag 21 januari 2010 19:50

Acties:

0 Henk 'm!

evanraalte

Topicstarter

Bedankt voor de reacties,

Eerst een plaatje over hoe het eruit zal moeten zien (dit is zonder php ondersteuning) Afbeeldingslocatie: http://www.imagespray.nl/shared/ltvdiw0t.png

Afbeeldingslocatie: http://www.imagespray.nl/shared/ltvdiw0t.png

Het idee hierachter is dat je je achtergrond kan veranderen door een plaatje van een site te kiezen.

en zo ziet het eruit:

http://erikdevelopment.site90.net/voorbeeld.php

met deze code:

PHP:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<?php
if (!empty($_POST)){
$achtergrond=$_POST["plaatje"];
}
else {
$achtergrond="plaatje.jpg";
}
?>
<html>
<head>
<style type="text/css">

p {font-family:Calibri;
    font-size=13px;}
img
{
border-style: none;
text-decoration: none;
} 
a:hover, a:active {
            width: 273px;
            height: 137px;
            background: url(plaatje.png) center no-repeat;
        }
a {
            width: 273px;
            height: 137px;
            background: url(plaatje2.png) center no-repeat;
</style>


<title>Untitled</title>
</head>
<body background="<?php echo("$achtergrond"); ?>">
<a href="index.php"></a><a href="index.php"></a><a href="index.php"></a><a href="index.php"></a><a href="index.php"></a>

<form method="POST" action="<?php echo($_SERVER["PHP_SELF"]);?>">
<p>Kies je achtergrond (website intypen)<input type="text" name="plaatje">
<input type="submit" name="submit">
</form>


</P>
</body>
</html>

[ Voor 3% gewijzigd door evanraalte op 21-01-2010 19:52 ]

donderdag 21 januari 2010 19:54

Acties:

0 Henk 'm!

CodeCaster

Can I get uhm...

Goed zo, de eerste helft heb je begrepen, je hebt de code gepost.

Nu nog even vertellen wat er niet aan werkt.

https://oneerlijkewoz.nl
Op papier is hij aan het tekenen, maar in de praktijk...

donderdag 21 januari 2010 19:58

Acties:

0 Henk 'm!

DeluxZ

Livin' the good life

Ik snap niet waarom je de styles nu naar je php file hebt gehaald. Het werkt prima in een externe stylesheet als je gewoon even de comments leest en toepast in je code. De antwoorden zijn allang gegeven

]|[ Apple Macbook Pro Retina 13" ]|[

donderdag 21 januari 2010 19:59

Acties:

0 Henk 'm!

MueR

Admin Tweakers Discord

is niet lief

Haal het resultaat van die pagina eens door een validator, want dit slaat echt helemaal nergens op. Je sluit je CSS rules niet af, je sluit een paragraph tag op de verkeerde plek af, je gebruikt invalide CSS syntax. Deze code is een teringzooi. Leer HTML, CSS en PHP en probeer het dan nog een keer. Zonder een what you see is what you (hardly ever) get editor.

Anyone who gets in between me and my morning coffee should be insecure.

donderdag 21 januari 2010 20:02

Acties:

0 Henk 'm!

evanraalte

Topicstarter

Nouw kijk, Als ik in mijn html editor de code bekijk ziet het er zo uit als in de afbeelding. Omdat het slechts een editor is doet php het niet, en dat wil ik nou juist ook.

Als ik em op de usb-webserver doe krijg ik een goed php resultaat. Maar ten koste van de css. De buttoms verdwijnen namelijk. De reden dat er php inzit is dat ik de bezoeker de mogelijkheid geef om zijn achtergrond naar keuze te kiezen.

Hier is dus php voor nodig, maar als ik die dus op mijn site zet werkt de opmaak niet meer.

zo ziet het er op mijn site uit: (de php werkt hier wel, maar de css niet)
Afbeeldingslocatie: http://www.imagespray.nl/shared/gegjef*b.png

Afbeeldingslocatie: http://www.imagespray.nl/shared/gegjef*b.png

en het moet er zo uitzien als in de html editor, zo dus: ( en hier werkt de php niet, en de css wel)

Afbeeldingslocatie: http://www.imagespray.nl/shared/ltvdiw0t.png

Ik wil dat ze het allebij doen

dat is het enige

[ Voor 9% gewijzigd door evanraalte op 21-01-2010 20:03 ]

donderdag 21 januari 2010 20:03

Acties:

0 Henk 'm!

Verwijderd

in CSS file:
standaard CSS. Extensie boeit niet

In je index.php
- In head: CSS die afhankelijk is van PHP. PHP tags kunnen hierin verwerkt worden voor dynamische dingen.
- voor de rest hetzelfde als je nu hebt.

Je hebt zo trouwens wel een cross-site scripting attack binnen. Zorg ervoor dat je met file_exists controleert of het $achtergrond bestand bestaat op de server.

donderdag 21 januari 2010 20:05

Acties:

0 Henk 'm!

evanraalte

Topicstarter

Ik heb ingesteld dat $achtergrond standaard "plaatje.jpg"is. hier dus geen probleem.

Maar wat bedoel je met php tags die erin verwerkt kunnen worden

donderdag 21 januari 2010 20:06

Acties:

0 Henk 'm!

Alfredo

Niet moeilijk toch dat het er op je site anders uitziet? Je code klopt niet (zie MueR in "css met php combineren").
En je browser rendert geen lege anchors (<a>), dus die ga je zo nooit te zien krijgen.

donderdag 21 januari 2010 20:08

Acties:

0 Henk 'm!

evanraalte

Topicstarter

Maar ik wil alleen de plaatjes, hoe ga ik dat dan doen?

donderdag 21 januari 2010 20:08

Acties:

0 Henk 'm!

MueR

Admin Tweakers Discord

is niet lief

Dit gaat hem niet worden. Zolang je blijft aankloten met een WYSIWYG editor, invalide CSS en HTML en twijfelachtige php gaat dit een heel, heel erg lang verhaal worden. We zijn hier geen quickfix desk waar we al je problemen even oplossen. Je structurele probleem is een gebrek aan HTML/CSS kennis. Verder negeer je constant opmerkingen van ervaren programmeurs en frontenders. Hier heb ik geen zin in in, dit valt onder de categorie scriptrequests. Kom maar terug wanneer je een fatsoenlijke TS neerzet, met duidelijke validerende code.

Anyone who gets in between me and my morning coffee should be insecure.