Oficjalne forum pomocy serwisu PUN.pl

Niestety, nikt nie powie Ci czym jest FluxBB - musisz go poznać sam!

Nie jesteś zalogowany na forum.

#1 2013-05-11 18:22:22

xn
Użytkownik
Dołączył: 2010-08-09
Liczba postów: 455

[PHP, CSS] Jdevo: wykrywanie wersji mobilnej

Oto prosty kod, który pozwoli na wykrycie wersji mobilnej.
Po co? Możemy np. wyłączyć obrazkowe tło, przezroczystości i ogólnie przystosować naszą stronę do urządzeń mobilnych.
Oczywiście można by to wykonać w CSS,
Potrzebujemy trzech rzeczy:
I. Jdevo
II. Darmowy hosting obsługujący PHP5 (jeśli wasz serwer obsługuje tylko PHP4 to pobierzcie wersję 1.3 Jdevo)
II. PHP Mobile detector: http://mobiledetect.net/

Instrukcja:
   1. Rozpakuj archiwum ze strony mobiledetect
   2. Wrzuć plik Mobile_Detect.php do folderu Jdevo
   3. Otwórz plik style.php
   4. PRZED "?>" wklej:

// Tryb mobilny. 
if (isset($_COOKIE['device']))		// jeśli jest cookie "urządzenie"
{									
	if($_COOKIE[device] == mobile)	// jeśli cookie "urządzenie" ma wartość "mobile"
	{
		include('mobi.css');;
	}
	
	// Jeśli chcesz dać oddzielny kod tylko dla komputerów odkomentuj ten kod:
	/* 
	if($_COOKIE[device] == pc)	
	{
		include('pc.css');;
	}
	*/
}
else								// jeśli nie ma cookie "urządzenie"
{
	include 'Mobile_Detect.php';	// kod do wykrywania urządzeń mobilnych
	$detect = new Mobile_Detect();
	if ($detect->isMobile())		// jeśli dowolne urządzenie mobline, wliczając tablety
	//if ($detect->isMobile() && !$detect->isTablet())  // opcjonalnie: jeśli dowolne urządzenie, za wyjątkiem tabletów.
	{
		setCookie("device", "mobile", time()+24*3600*30);
		include('mobi.css');;
	}
	
	else							// jeśli nie urządzenie mobilne
	{
		setCookie("device", "pc", time()+24*3600*30);
		//include('mobi.css');;             // jeśli chcesz dać oddzielny kod tylko dla komputerów odkomentuj również tę linię
	}
}

i zapisz.
   6. Wrzuć kod CSS dla wersji mobilnej do mobi.css
   7. Wrzuć pliki (style.css, mobi.css, Mobile_Detect.php) na serwer.

I gotowe. [dblpt])

Oczywiście, moglibyśmy to zrobić w JS, ale jak pokazują statystyki mojego forum z ostatnich 30 dni - na ponad 6000 odwiedzin z urządzeń mobilnych około 23% urządzeń ma wyłączoną obsługę JS, lub nie obsługuje jej wcale...
0QcrEoJ.png
...and not a single javascript was given that day. [dblpt]D

Offline

#2 2013-05-11 19:45:52

rezystor
Użytkownik
Skąd: z domu
Dołączył: 2009-09-30
Liczba postów: 1,638
WWW

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

To ja napiszę tylko jedno - genialne!

Ostatnio edytowany przez rezystor (2013-05-11 19:46:08)

Offline

#3 2013-05-12 11:14:41

xn
Użytkownik
Dołączył: 2010-08-09
Liczba postów: 455

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

Przykładowy kod CSS:


/* Wersja dla telefonów: */
body {
	background-image: none !important;
}
body * {
	box-shadow: none !important;
	text-shadow: none !important;
	border-radius: 0px 0px 0px 0px !important;
	opacity: 1 !important;
}
#punwrap {
	background-image: none !important;
	max-width: 100% !important;
	width: auto !important;
}
div#brdheader ~ div[style="text-align:center;"]:before {
    content: "Styl mobilny by Nit.";
}

/* Niżej - uproszczony wygląd postów */
div.postleft {
    width: 100% !important;
}
div.postfootleft {
    width: 100px !important;
}
div.postleft dd {
    display: inline !important;
    padding: 2px !important;
}
div.postright, div.postfootright {
    border: none !important;
    padding-left: 20px !important;
}
div.postleft dd:after {
    content: " | ";
}
dd.usertitle:after {
    content: none !important;
}
dd.usertitle * {
    display: none !important;
}
div.postsignature {
    display: none !important;
}
dd.postavatar img {
    max-width: 100px !important;
    max-height: 60px !important;
    float: left !important;
	padding: 7px;
}
dd.postavatar:after {
    content: none !important;
}
#zaraz_bedzie_ciemno {
	background-image: none;
	width: auto !important;
	}

Efekt: wyłącza wszystkie zaokrąglenia, cienie, tła obrazkowe, upraszcza wygląd postów.

Offline

#4 2013-05-24 21:04:11

beniek
Użytkownik
Dołączył: 2013-03-07
Liczba postów: 87

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

Słuchaj, mam problem z podpunktem 6, 7.
Starałem się, ale coś powodowało, że całe jdevo nie działało, musiałem usuwać tę część dla wersji mobilnej.

Offline

#5 2013-05-24 21:15:20

xn
Użytkownik
Dołączył: 2010-08-09
Liczba postów: 455

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

Coś więcej? Jakiś błąd wyskakiwał?
Może problem z kodowaniem? Używasz tak jak w poradniku do Jdevo pisałem: utf-8 bez BOM?

Ostatnio edytowany przez xn (2013-05-24 21:15:59)

Offline

#6 2013-05-25 18:03:01

beniek
Użytkownik
Dołączył: 2013-03-07
Liczba postów: 87

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

Właśnie, że żadnego błędu nie było, tylko po prostu opcje mi nie działały.

Offline

#7 2013-05-26 00:11:44

xn
Użytkownik
Dołączył: 2010-08-09
Liczba postów: 455

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

czyli nie załączyłeś poprawnie stylu

Offline

#8 2013-05-27 12:04:54

beniek
Użytkownik
Dołączył: 2013-03-07
Liczba postów: 87

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

Już działa, dzięki [dblpt])

Takie jeszcze pytanie: Czy do wersji jdevo dało by się aby stylem domyślnym był styl dzienny?
Oraaz czy za każdym razem trzeba włączać dźwięk na czacie?

Offline

#9 2013-05-27 15:37:48

xn
Użytkownik
Dołączył: 2010-08-09
Liczba postów: 455

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

Za każdym razem? Jak to? Nie rozumiem?

Co do pierwszego:
style php:
1. Przed:

// Tylko styl dzieny.

Dodaj: 

	if ($_COOKIE[settings] == auto) {
		if($dayornight == 'night')
		{
			echo "@import url('night.css');";
		}
		
		elseif($dayornight == 'day')
		{
		  echo "@import url('day.css');";
		}
		echo "\n/* Automatyczna zmiana dzień/noc */\n";
	}

------

2. Zamień:

// Jeśli nie ma cookie. Styl dzienny.
else
{
	if($dayornight == 'night')
	{
		echo "@import url('night.css');";
	}
	
	elseif($dayornight == 'day')
	{
      echo "@import url('day.css');";
	}
	echo "\n/* Automatyczna zmiana dzień/noc */\n";
}

Na:

// Jeśli nie ma cookie. Styl dzienny/nocny zależny od godziny.
else
{
      echo "@import url('day.css');";
	echo "\n/* Dzien - domyslnie */\n";
}

-----


settings.php

1. Zamień:

elseif ($_GET['set'] == auto) 						//jeśli dodamy do adresu strony ?set=auto
	{
		setCookie("settings", "", time() - 3600);	//to dołączy się cookie "settings" o wartości "day".

na:

elseif ($_GET['set'] == auto) 						//jeśli dodamy do adresu strony ?set=auto
	{
		setCookie("settings", "auto", time()+24*3600*365);	//to dołączy się cookie "settings" o wartości "auto".

I tyle [sred])

Ostatnio edytowany przez xn (2013-05-27 15:38:55)

Offline

#10 2013-05-27 16:39:17

beniek
Użytkownik
Dołączył: 2013-03-07
Liczba postów: 87

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

Dzięki, jak można zrobić, aby dla danego użytkownika, zakłądając, że wybrał stale styl nocny, po ponownym uruchomieniu komputera miał dalej ten styl nocny?
Tłumacząc to: chodzi o to, że ustawienia jdevo nie są trwałe, bo po wyłączeniu przeglądarki lub komputera, to powracają domyślne ustawienia.

Offline

#11 2013-05-27 18:36:24

xn
Użytkownik
Dołączył: 2010-08-09
Liczba postów: 455

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

Może pobrałeś starą wersję? Stara wersja miała błąd i nie ustawiała ważności cookies.
Sprawdź czy przy wszystkie linijki w settings.php zaczynające się na setCookie(" kończą się na time()+24*3600*365); lub time() - 3600); - pierwszy to ustawienie ciasteczka z ROCZNĄ ważnością, natomiast drugie - usunięcie ciasteczka (przywrócenie domyślnych ustawień).

Ostatnio edytowany przez xn (2013-05-27 18:38:17)

Offline

#12 2013-05-28 08:24:53

beniek
Użytkownik
Dołączył: 2013-03-07
Liczba postów: 87

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

Pobrałem wersję 1.5

hmmm

 
<?php

/*
 * Jdevo: dynamiczne generowanie treści css dla stron bez możliwości modyfikacji php.
 *
 * @author		Nitrol (Lewek)
 * @link		https://sourceforge.net/projects/jdevo/
 * @license		GNU General Public License 3 (http://www.gnu.org/licenses/)
 *
 * This program is free software; you can redistribute it and/or modify it
 * under the terms of the GNU General Public License as published by the
 * Free Software Foundation; either version 3 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU General Public License for more details:
 * http://www.gnu.org/licenses/
 */

header('Content-type: text/css; charset=UTF-8');

/* Początek kodu Sunrise - Sunset */

/*
 * Sunrise - Sunset PHP Script by Mike Challis
 * http://642weather.com/weather/scripts.php
 * Wymaga PHP 5 (5.1.3 lub nowszej)
 * You are free to use and modify the code
*/
$mytz = 'europe/warsaw'; 
$time_format = 'h:i a t'; // 08:53 pm pdt
$latitude  = 50;
$longitude = 19;
//$zenith = 90+(50/60); // true sunrise/sunset
//$zenith = 96;          // civilian twilight - conventionally used to signify twilight
$zenith = 102;         // nautical twilight - the point at which the horizon stops being visible at sea.
//$zenith = 108;         // astronomical twilight - the point when sun stops being a source of any illumination.
putenv("tz=$mytz");

// find time offset in hours
$tzoffset = date("z")/60 / 60;
$dayornight = day_or_night();


function day_or_night() {
   global $latitude, $longitude, $tzoffset, $zenith;

   $sunrise = date_sunrise(time(), SUNFUNCS_RET_DOUBLE, $latitude, $longitude, $zenith, $tzoffset);
   $sunset = date_sunset(time(), SUNFUNCS_RET_DOUBLE, $latitude, $longitude, $zenith, $tzoffset);
   $now = date("H") + date("i") / 60 + date("s") / 3600;

   if ($sunrise < $sunset)
      if (($now > $sunrise) && ($now < $sunset)) return "day";
         else return "night";
   else
     if (($now > $sunrise) || ($now < $sunset)) return "day";
        else return "night";
}
/* Koniec kodu Sunrise - Sunset */
 
// Styl dzień/noc
if (isset($_COOKIE['settings']))				
{

          
          if ($_COOKIE[settings] == auto) {
        if($dayornight == 'night')
        {
            echo "@import url('night.css');";
        }
        
        elseif($dayornight == 'day')
        {
          echo "@import url('day.css');";
        }
        echo "\n/* Automatyczna zmiana dzień/noc */\n";
    }
     
	// Tylko styl dzieny.
	if ($_COOKIE[settings] == day)
	{
		echo "@import url('day.css');";
		echo "\n/* ZAWSZE STYL DZIENNY */\n"; 
	} 
	
	// Tylko styl nocny.
	if ($_COOKIE[settings] == night)
	{
		echo "@import url('night.css');";
		echo "\n/* ZAWSZE STYL NOCNY */\n"; 
	} 
	
	// Styl wyłączony.
	if ($_COOKIE[settings] == off)
		{
		echo "@import url('nostyle.css');";
		echo "\n/* STYL DZIENNY/NOCNY WYŁĄCZONY */\n";
		}
}

// Jeśli nie ma cookie. Styl dzienny/nocny zależny od godziny.
else
{
      echo "@import url('day.css');";
    echo "\n/* Dzien - domyslnie */\n";
}


// Szerokość stylu.
if (isset($_COOKIE['width']))
{
	// Szeroki
	if ($_COOKIE[width] == wide)
	{
		echo "\n#punwrap {width: 98%;}\n";	//	"\n" oznacza nową linię
	} 
	
	// Wąski
	if ($_COOKIE[width] == box)
	{
		echo "\n#punwrap {width: 75% !important; min-width:900px; max-width:1300px; margin: 1em auto;}\n"; 
	} 

}

// Wyłączenie stopki forum (jeśli jest cookie).
if (isset($_COOKIE['footer']))
{
	echo "\n div#brdfooter.stopka {display: none;} \n";
}
else 
{
	echo "\n /*stopka jest włączona */ \n";
}

// Dźwięk wiadomości w CB. Domyślnie wyłączony
if (isset($_COOKIE['dzwiek']))
{
    echo "\n div.cb_all:last-child object { display: inline;} \n div.cb_all:nth-child(10) object, div.cb_all:nth-child(100) object {display: none;} \n ";
}
else 
{
    echo "\n /* Dźwięk wiadomości w CB wyłączony */ \n";
}

// Domyślnie usuwa "moderowane przez".
if (isset($_COOKIE['moderowane']))
{
	echo "\n /* Moderowane przez: włączone */ \n";
}
else 
{
	echo "\n div.intd div.tclcon p {display: none; } \n";
}


//Kopirajty Jdevo, nie usuwać!
echo
'


/*
 * Treść wygenerowana przez Jdevo (punBB edition): dynamicznie generowane style dla for punBB.
 * 
 * 
 * @author		Nitrol (Lewek)
 * @link		https://sourceforge.net/projects/jdevo/
 * @license		GNU General Public License 3 (http://www.gnu.org/licenses/)
 *
 * This program is free software; you can redistribute it and/or modify it
 * under the terms of the GNU General Public License as published by the
 * Free Software Foundation; either version 3 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU General Public License for more details:
 * http://www.gnu.org/licenses/
 *
 * Zawartość arkusza CSS generowany przez Jdevo nie jest objęta licencją GNU (chyba, że autor stylu zaznaczył inaczej).
 * Jednocześnie zabrania się usuwania tego komentarza, ponieważ jest to informacja licencyjna Jdevo.
 *
 */
'
?>

Edit: Sorry wszystko jest dobrze, okazało się, że moja przeglądarka miała automatyczne usuwanie ciasteczek, dlatego nic się nie zapisywało w ustawieniach [dblpt])

Ogromnie Dziękuję za pomoc [dblpt])
Masz do tego głowę.

Ostatnio edytowany przez beniek (2013-05-28 16:03:48)

Offline

#13 2013-08-19 09:02:19

was
Użytkownik
Dołączył: 2013-08-15
Liczba postów: 8

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

Móglby ktos wyjasnic dokładniej co trzeb zarobic w pkt 6 i 7?

Offline

#14 2013-08-19 22:51:27

gremzi
Użytkownik
Skąd: przecież jesteś ładna :D
Dołączył: 2013-08-13
Liczba postów: 32
WWW

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

ciekawie i tak mobilnie xD


Grasz w tibieme? zapraszam KLIK

Offline

#15 2013-08-20 07:30:37

xortdan
Użytkownik
Skąd: dom
Dołączył: 2012-11-25
Liczba postów: 363
WWW

Odp: [PHP, CSS] Jdevo: wykrywanie wersji mobilnej

W 7 punkcie trzeba wrzucić pliki na serwer np: za pomocą  FileZilla. Ale jeśli tego nie umiesz to lepiej nie bierz się za to.

Offline

Użytkowników czytających ten temat: 0, gości: 1
[Bot] ClaudeBot

Stopka

Forum oparte na FluxBB

Darmowe Forum
esports-gaming - test99990 - test23235665765765877 - bossmafia - aaaaaaaa