List in stylesheet

[Yarisken]

Hallo,

Ik heb een kleine website met een 10 pagina's. Af en toe moet ik een aanpassing doen aan deze lijst maar dan moet ik dit aanpassen op alle 10 de pagina's.
Is er een mogelijkheid om een lijst met linken op te slaan in een style sheet zodat ik dit maar op 1 plaats moet aanpassen ?

[orf]

Het kan niet in een stylesheet (je hebt content als property, maar dat is plain text, geen html).
Misschien kun je iets met Server Side Includes of met een server-side taal als PHP? Als last resort kun je ook nog javascript gebruiken, maar dat moet je denk ik niet willen.

[Yarisken]

orf schreef op donderdag 2 november 2017 @ 20:22:
Het kan niet in een stylesheet (je hebt content als property, maar dat is plain text, geen html).
Misschien kun je iets met Server Side Includes of met een server-side taal als PHP? Als last resort kun je ook nog javascript gebruiken, maar dat moet je denk ik niet willen.

Nee idd php, python of javascript kan ik niet gebruiken. Ik weet nog van een ver verleden dat ik zoiets is had opgelost met iframes.
Thx voor de info, dan zal ik telkens 10 pagina's doorlopen :-)

[Reptile209]

Geef eens een voorbeeld van wat er op die 10 pagina's staat, en wat je dan typisch moet aanpassen. Want als je zoveel dubbele info op zoveel pagina's hebt, dan vraag je om ellende . Gaat het om tekst, plaatjes, kleuren, ...?

[Yarisken]

Reptile209 schreef op donderdag 2 november 2017 @ 20:43:
Geef eens een voorbeeld van wat er op die 10 pagina's staat, en wat je dan typisch moet aanpassen. Want als je zoveel dubbele info op zoveel pagina's hebt, dan vraag je om ellende . Gaat het om tekst, plaatjes, kleuren, ...?

Gewoon links zoals deze <a href="url">link text</a>
Maar dan nu 10 ofzo. Om de zoveel tijd komt er een link bij.
Dus dat is dan 10 pagina's opendoen en copy / paste van de nieuwe link.
Ik had eerst 1 pagina met div's en javascript maar niet IE8 compliant .... .
Dus moet het nu op de oude manier. Ik hoopte nog iets van optimalisatie uit de brand te slepen.

[Ramon]

Klinkt alsof je een statische site hebt. De site ombouwen om gebruik te maken van een static site generator is dan een mogelijke oplossing. Je bouwt dan je pagina's in bijvoorbeeld markdown, en hebt een template die de html omvat. De static site generator loopt dan over al je markdown content en kan hier dan een lijst van maken voor je. Daarna zet je het resultaat online.

Volgende keer dat je iets aanpast draai je de static site generator nogmaals en zet je de wijziging online.

Hier kan je meer lezen over static site generators: https://www.smashingmagaz...enerators-next-big-thing/ en https://jekyllrb.com/ is een veel gebruikte (maar er zijn er honderden).

[orf]

Niet bepaald ideaal, maar je zou zoiets als .js bestand op kunnen nemen en dat als script src op elke pagina zetten.

JavaScript:

var list = [
  {href : 'https://google.com', text : 'google.com'},
  {href : 'https://tweakers.net', text : 'Tweakers'},
  {href : 'https://wikipedia.org', text : 'Wikipedia'}
];


var ul = document.createElement('ul');
for (var i = 0; i < list.length; i++){
  var li = document.createElement('li');
  var a = document.createElement('a');
  a.setAttribute('href', list[i].href);
  a.innerHTML = list[i].text;
  li.appendChild(a); 
  ul.appendChild(li);
}

// ervan uitgaande dat je een <div id="footer"> hebt.
document.getElementById('footer').appendChild(ul);

Ongetest, mijn javascript is een beetje roestig.

[q-enf0rcer.1]

orf schreef op donderdag 2 november 2017 @ 21:07:
Niet bepaald ideaal, maar je zou zoiets als .js bestand op kunnen nemen en dat als script src op elke pagina zetten.

JavaScript:

var list = [
  {href : 'https://google.com', text : 'google.com'},
  {href : 'https://tweakers.net', text : 'Tweakers'},
  {href : 'https://wikipedia.org', text : 'Wikipedia'}
];


var ul = document.createElement('ul');
for (var i = 0; i < list.length; i++){
  var li = document.createElement('li');
  var a = document.createElement('a');
  a.setAttribute('href', list[i].href);
  a.innerHTML = list[i].text;
  li.appendChild(a); 
  ul.appendChild(li);
}

// ervan uitgaande dat je een <div id="footer"> hebt.
document.getElementById('footer').appendChild(ul);

Ongetest, mijn javascript is een beetje roestig.

Let op: voor SEO is dit dramatisch, omdat de search engines deze links niet zullen zien. Dat kun je wel oplossen door een prerender te gebruiken. Maar dat lijkt mij overkill hiervoor.

[We Are Borg]

q-enf0rcer.1 schreef op zaterdag 4 november 2017 @ 11:58:
[...]


Let op: voor SEO is dit dramatisch, omdat de search engines deze links niet zullen zien. Dat kun je wel oplossen door een prerender te gebruiken. Maar dat lijkt mij overkill hiervoor.

https://searchengineland....ript-heres-learned-220157

En dat was in 2015

[q-enf0rcer.1]

We Are Borg schreef op zondag 5 november 2017 @ 07:36:
[...]

https://searchengineland....ript-heres-learned-220157

En dat was in 2015

Dat is natuurlijk fantastisch, maar werkt zover bekend is alleen goed voor Google.

In dit artikel worden er meer search engines getest, want SEO gaat verder dan Google:

https://medium.freecodeca...-the-backend-74ce5015c0c9

Alleen Google is blijkbaar in staat client side rendered pages the crawlen, hoewel alle robots wel in staat zijn de pagina's te indexeren.

Het is niet voor niets dat moderne frameworks zoals Angular 2+ en ReactJS beschikken over server side rendering:

https://blog.pusher.com/make-angular-4-app-seo-friendly

[BarôZZa]

Yarisken schreef op donderdag 2 november 2017 @ 20:39:
[...]

Nee idd php, python of javascript kan ik niet gebruiken. Ik weet nog van een ver verleden dat ik zoiets is had opgelost met iframes.
Thx voor de info, dan zal ik telkens 10 pagina's doorlopen :-)

Dat kan nu toch ook nog steeds?

Zet de lijst in een los html bestand en zet een iframe op elke pagina met die pagina erin.

Dan hoef je voortaan alleen nog maar de html aan te passen van de lijst.

Uiteraard SEO technisch niet ubernextlevel, maar ik verwacht dat een site met 10 pagina's uberhaubt niet snel gevonden wordt aan de hand van de termen in dat lijstje.

[Yarisken]

Idd maar heb nu de pagina's al aangemaakt. Thx voor de feedback allemaal.

[Dark Blue]

Yarisken schreef op donderdag 2 november 2017 @ 20:39:
[...]

Nee idd php, python of javascript kan ik niet gebruiken. Ik weet nog van een ver verleden dat ik zoiets is had opgelost met iframes.
Thx voor de info, dan zal ik telkens 10 pagina's doorlopen :-)

Dat je PHP, Python en JavaScript in 1 adem noemt vind ik toch reden om even te reageren.
PHP en Python zijn serverside talen die je server moet ondersteunen. JavaScript moet de browser van de client ondersteunen, en als ik je even verderop over IE8-compatibility zie praten kan ik daar enigszins de link tussen leggen en de aanname doen dat IE8-fossielen geen JavaScript aan hebben staan (dikke aanname, volgens mij outdated). Toch wil ik het even aanstippen.

Die 'lelijke' oplossing met JavaScript kan dus wel, ook al is je server beperkt.

Yarisken schreef op zondag 5 november 2017 @ 16:43:
Idd maar heb nu de pagina's al aangemaakt. Thx voor de feedback allemaal.

Ook hier weet ik niet precies wat je bedoelt. Je opent dit topic dacht ik toch voor een langetermijnoplossing. Heb je wat gehad aan de aangedragen oplossingen hier?

Zelf was ik nog niet op de hoogte van static site generators. Bedankt @Ramon !

[DJMaze]

Yarisken schreef op donderdag 2 november 2017 @ 20:52:
maar niet IE8 compliant .... .

Voor wie überhaupt nog IE8, IE9 of IE10 gebruikt, zou het internet verboden moeten worden!
En de gene die vind dat het daar in moet werken idem dito.

Zelf blokkeer ik alle toegang met deze browsers, ze worden altijd doorgestuurd naar een website met uitleg waarom ze worden verbannen.

[ Voor 18% gewijzigd door DJMaze op 07-11-2017 11:15 ]