Filtrare elementi in pagina web [Archivio]

View Full Version : Filtrare elementi in pagina web

quelarion

12-07-2014, 16:02

Salve a tutti,
avrei bisogno di poter visualizzare solo una porzione di una pagina web via browser mobile, ma non riesco a capire che strada si possa prendere.

Nello specifico:

- ho questa pagina (http://en.vedur.is/weather/forecasts/areas/)
- vorrei poter visitarla da WP8 (explorer o UC browser) visualizzando solo la mappa al centro

Se ci fosse una specie di adblock ci vorrebbero 2 secondi, ma non ho trovato niente del genere. Non si potrebbe creare una pagina html che vada a prendersi solo quel pezzo di pagina?
Premetto che ho un'esperienza limitata con HTML e zero CSS o PHP.

Grazie!

ndakota

12-07-2014, 16:16

Conosci Bootstrap (http://getbootstrap.com/)? E' un framework web Html, Css, Javascript molto semplice. Gestisce anche il responsive su device di dimensioni differenti. Ora mettiamo caso che tu abbia una pagina del genere.

<!doctype html>
<head>
<title>Tua pagina</title>
</head>
<body>
<header>
</header>
<nav>
</nav>
<article>
</article>
<footer>
</footer>
</body>
</html>

Vuoi visualizzare solo l'article e il suo contenuto su mobile? Con Bootstrap farai una cosa del genere.

<!doctype html>
<head>
<title>Tua pagina</title>
</head>
<body>
<header class="hidden-lg hidden-md">
</header>
<nav class="hidden-lg hidden-md">
</nav>
<article>
</article>
<footer class="hidden-lg hidden-md">
</footer>
</body>
</html>

Praticamente gestisce la larghezza del device dividendo in:
- lg (Large devices: Desktops (≥1200px))
- md (Medium devices: Desktops (≥992px))
- sm (Small devices: Tablets (≥768px))
- xs (Extra small devices: Phones (<768px))
Ci sono anche le rispettive classi visible-lg, visible-md, visibile-sm, visible-xs.

ndakota

12-07-2014, 16:19

Guarda qui, ti sarà tutto più chiaro.
http://getbootstrap.com/css/#responsive-utilities

quelarion

12-07-2014, 17:01

ndakota

12-07-2014, 17:06

Grazie, gli darò subito un'occhiata.

Ma se ho capito bene si tratta di codice per ottimizzare la visualizzazione del proprio sito su mobile, giusto? O posso anche usarlo per filtrare contenuti di siti internet? A me servirebbe qualcosa che carichi una pagina da internet e nasconda un certo numero di elementi. Esattamente come adblock, ma che funzioni su WP8.
Guarda, il metodo che ti ho illustrato fa esattamente quello che dici nel grassettato. Bootstrap ti offre gli strumenti per sviluppare un sito web e visualizzarlo come vuoi tu, anche in modo diverso, sui vari tipi di dispositivi. Poi se mi chiedi se è il modo migliore per te, questo non lo so.

quelarion

12-07-2014, 17:20

Il punto è che io voglio visualizzare un sito di altri, non svilupparne uno mio. Il sito sta lì, non posso modificare il codice delle pagine sul server. E non conoscendo CSS non capisco se con bootstrap posso creare un wrapper che vada a prendersi la pagina di un sito a piacere e ne filtri i contenuti.
Se si può fare, mi studio la cosa e lo faccio ;)

ndakota

12-07-2014, 17:22

Ah sorry, non avevo capito! Pensavo stessimo parlando di un tuo sito. Effettivamente penso tu possa farlo lo stesso, però non è più altrettanto facile :D

quelarion

12-07-2014, 17:25

Ok, allora ci penso e vedo quanta voglia ho di fare cose complicate nel weekend ;) Grazie!

OoZic

13-07-2014, 02:17

Con la sola conoscenza dell'html purtroppo non riesci a fare quel che chiedi.

Ti serve un linguaggio server side che possa fare un operazione di "scraping" del sito che ti serve.

Per farti capire è uno script che estrae le informazioni dal sito che ti serve e te le mette a disposizione, dopo di che puoi inserirle in un documento html che caricherai sul tuo sito o dove vuoi.

Se non conosci nessun linguaggio di programmazione potresti cominciare con Python che è relativamente semplice e questa è una delle librerie più famose:
http://www.crummy.com/software/BeautifulSoup/bs4/doc/