Webfront - Her mit eure eigen Seiten...

Hallo,

bastel grad mit WebFront an eigenen Seiten - leider tu ich mich da immer ein bissel schwer.

Könnten mal ein paar Profis einfach die PHP Datei einer selbst erstellten Seite hochladen ?

Das Einbauen in die Menüstruktur ist kein Problem … aber dann die Seite mit Leben erfüllen…

Suchen tu ich was für Fensterkontakte, Temperaturen, Webcam… Kann ja mal jeder zeigen was er kann - am besten gleich mit einem Screenshot…

Danke !

Gruß

epogo

hmm ich kann dir diese anbieten, hab ich aber auch nur mit Hilfe hinbekommen:

<!--
<!DOCTYPE html
	PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-->

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<meta http-equiv="Cache-Control" content="no-store, no-cache, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 

<style type="text/css">@import "Temperaturen.css";</style>

</head><body>

<div id="containerMiddleContent">

	<div class="deviceContainer" style="background: transparent url(/img/icons/png/Temperature.png) no-repeat scroll 10px 4px">
		<div class="deviceTitle">
			<div class="deviceTitleContent">Wohnzimmer</div>
		</div>
		<div class="deviceStateExtended">
			<div class="variableDisplay">
				<div class="deviceStateContent"><? echo number_format(GetValue(52137), 2, ',', '.');?> °C</div>
			</div>
			

		</div>
	</div>
	
	<div class="deviceContainer" style="background: transparent url(/img/icons/png/Temperature.png) no-repeat scroll 10px 4px">
		<div class="deviceTitle">
			<div class="deviceTitleContent">Kueche</div>
		</div>
		<div class="deviceStateExtended">
			<div class="variableDisplay">
				<div class="deviceStateContent"><? echo number_format(GetValue(32425), 2, ',', '.');?> °C</div>
			</div>
		</div>
	</div>

	<div class="deviceContainer" style="background: transparent url(/img/icons/png/Temperature.png) no-repeat scroll 10px 4px">
		<div class="deviceTitle">
			<div class="deviceTitleContent">Flur</div>
		</div>
		<div class="deviceStateExtended">
			<div class="variableDisplay">
				<div class="deviceStateContent"><? echo number_format(GetValue(54453), 2, ',', '.');?> °C</div>
			</div>
		</div>
	</div>

	<div class="deviceContainer" style="background: transparent url(/img/icons/png/Temperature.png) no-repeat scroll 10px 4px">
		<div class="deviceTitle">
			<div class="deviceTitleContent">Gaeste_WC</div>
		</div>
		<div class="deviceStateExtended">
			<div class="variableDisplay">
				<div class="deviceStateContent"><? echo number_format(GetValue(45667), 2, ',', '.');?> °C</div>
			</div>
		</div>
	</div>

	<div class="deviceContainer" style="background: transparent url(/img/icons/png/Temperature.png) no-repeat scroll 10px 4px">
		<div class="deviceTitle">
			<div class="deviceTitleContent">Kinderzimmer Marie</div>
		</div>
		<div class="deviceStateExtended">
			<div class="variableDisplay">
				<div class="deviceStateContent"><? echo number_format(GetValue(52925), 2, ',', '.');?> °C</div>
			</div>
		</div>
	</div>
	
	<div class="deviceContainer" style="background: transparent url(/img/icons/png/Temperature.png) no-repeat scroll 10px 4px">
		<div class="deviceTitle">
			<div class="deviceTitleContent">Kinderzimmer Lara</div>
		</div>
		<div class="deviceStateExtended">
			<div class="variableDisplay">
				<div class="deviceStateContent"><? echo number_format(GetValue(17398), 2, ',', '.');?> °C</div>
			</div>
		</div>
	</div>
	
	<div class="deviceContainer" style="background: transparent url(/img/icons/png/Temperature.png) no-repeat scroll 10px 4px">
		<div class="deviceTitle">
			<div class="deviceTitleContent">Schlafzimmer</div>
		</div>
		<div class="deviceStateExtended">
			<div class="variableDisplay">
				<div class="deviceStateContent"><? echo number_format(GetValue(36325), 2, ',', '.');?> °C</div>
			</div>
		</div>
	</div>

	<div class="deviceContainer" style="background: transparent url(/img/icons/png/Temperature.png) no-repeat scroll 10px 4px">
		<div class="deviceTitle">
			<div class="deviceTitleContent">Badezimmer</div>
		</div>
		<div class="deviceStateExtended">
			<div class="variableDisplay">
				<div class="deviceStateContent"><? echo number_format(GetValue(44968), 2, ',', '.');?> °C</div>
			</div>
		</div>
	</div>


</div>


<!--
<a href="about:blank">Link</a><br /><br />
Text<br /><br />
-->
</body></html>

@muckel: Du solltest mal überall deviceStateExtended mit deviceState ersetzen, wie im zweiten Link gezeigt. Dann klappt 's auch mit der Wertezentrierung ;).

Danke Horst und muckel

… genau das wollte ich eigentlich damit erreichen. Überall stehen irgendwelche Infos… Ideal wäre halt ein Thread oder Wikieintrag wo man ein bissel stöbern kann und sich Anregungen holen kann. Wenn man dann grad noch eine Vorlage kopieren kann ist auch ein DAU gleich am Ziel.

Danke für Eure Infos…
Wenn ich mal soweit bin stell ich mein Beitrag auch hier rein…

Gruß

epogo

Keller mit Lüfter in Waschküche.

Hallo Rainer,

würdest Du mir mal die Seite im Quelltext zukommen lassen?

Mich würde die Sache mit der Gruppierung interessieren, wie hast Du das gelöst, eigene DIV-Klassen definiert?

Würde mich freuen.

Hallo Werner,

bitte schön.

camera.zip (5.55 KB)

Hallo Rainer

1000 Dank

…mit Euren Beispielen hier, habe ich schon meine Temperaturen, die Fenster und die IR Melder auf eigene Webfront Seiten gelegt…

Das ist ja wirklich kein Hexenwerk…Staun aber alleine hätte ich das im Leben nie hinbekommen.

DANKE dafür.

Nur die CSS Sheets stellen mich noch etwas vor :confused:
Aber das wird schon :slight_smile:

Mit der webfront.css als Kopie im /User Verzeichnis für die eigenen Seiten lässt sich da auch einiges schon, analog der Standardansicht, machen.
Bei den mir aktuell bekannten Codepages ist mir aufgefallen, dass eine Einbindung von ISO-???-1 rechts einen schwarzen Rand bei der eigenen Webpage macht…aber Umlaute richtig dargestellt werden. Nimmt man UTF ist das Format OK…aber die Umlaute & Sonderzeichen (Grad) machen Ärger.

Wenn jemand Interesse an IR Meldern und Fenster Stati php Dateien hat…einfach „hier“ schreien (ich finde es bei dem high end Kram von Euch zu simpel um es wirklich hier zu bewerben, oder?)

Gruss & keep posting your pages…

b71

Wer sich die webfront.css antut: Selber schuld ;). Die ist unübersichtlich und hat viel zu viel Inhalt, den man nicht braucht. Zudem habe ich da noch einige Altlasten drin, die ich mal aufräumen müsste.
Zum CSS-Bearbeiten empfehle ich die Benutzung von Firebug. Da dann per Klick auf Untersuchen und anschließendem Klick aufs jeweilige HTML-Element rechts herausfinden, welche Klassen für das Element gelten und wie sich das ganze vererbt und überschreibt. Die lassen sich da dann wunderbar manipulieren. Wenn es aussieht wie gewünscht die Änderungen an den Klassen in die eigene CSS-Datei schreiben und so ein aufgeräumtes System genießen.

Wenn man UTF-8 verwendet sollte man die Datei auch als UTF-8 abspeichern. Kann man selbst bei Notepad bei Speichern Unter angeben. Mein empfohlener Editor für Windows ist übrigens Notepad++.

@Horst

Das mag für Dich ja trivial sein…ich kann das leider für mich nicht behaupten und war froh die webfront.css als einsetzbar identifiziert zu haben.

Nehme aber gerne eine aktualisierte Version der webfront.css in Empfang :slight_smile:

By the way…wie kann man die Schriftgrösse der Menüitems im Webfront etwas verkleinern, damit mehr Seiten hinpassen …

Welche der Zeilen in der css Datei sind das ?

Gruss
B71