Signup for help - g-link CMS Newsletter here...Print?

Article written on 9. november 2005 by Anders

TopicCategoryPlatform / OSRelated issues...
Baggrundsfarver og vandmærkerSideopsætningWebhotel, WinXP som klientMore about the same subject...
Description of Problem / Solution:

Lars spørger:
Hvordan lægger jeg en anden baggrundsfarve på nogle af mine sider fra databasens side-tabel?

(Opdateret 2011-11-11)
Anders svarer:
I g-link CMS version 1.4 og ældre:
Det kan gøres på flere måder, men du skal først overveje, om der er tale om enkelte sider eller alle siderne. I det tilfælde hvor du ønsker at ændre alle sidernes baggrundsfarve, gøres det ved at ændre i de pågældende style sheets. Den attribut, der skal ændres, er background-color. Attributværdien kan angives som:

  • Navngivne farver (f.eks. "blue", "silver", "yellow", "green", etc. De kan kombineres med prefix "light" og "dark") eller
  • RGB-farver i decimal notation, f.eks. gul =  (255,255,127) eller
  • RGB-farver i hexadecimal notation, f.eks. gul = #FFFF77

Hvis du f.eks. vil ændre baggrundsfarven til gul på alle dine sider skal der i dit style sheet stå følgende:
background-color : #FFFF77;

Såfremt du kun ønsker at ændre baggrundsfarven på enkelte af dine sider, gør du det ved at ændre "Document Propoerties" (sideegenskaber) på dette ikon: Sideinstillings ikonet findes i editorens øverste venstre hjørne...
Et klik på dette ikon åbner nedenstående dialog i ver. 1.3 og ældre:

I denne dialog kan du angive en række parametre, herunder også primært og sekundært style sheet, som er forskellige fra det ""Main Style Sheet", som du kan redigere med Style Assistenten. Dvs. du gives mulighed for at generere dit eget style sheet - du kan vælge at kopiere/redigere et andet style sheet eller åbne din favorit teksteditor og skrive dit eget style sheet - og uploade det til web-serveren.  Men herudover kan du også sætte sidens baggrundsfarve og sidens generelle tekstfarve direkte i sidens tekst: Ved at klikke på knappen [...] får du en farvepallet, hvorpå du kan vælge den ønskede farve.

I g-link CMS version 1.4  ser dialogboksen lidt anderledes ud, idet den opdelt i fire faner, som tilsammen indeholder ovenstående parametre og lidt flere parametre: 

 

 

I g-link CMS version 1.5 og nyere er den samlede side ikke længere opbygget i rammer (frames), så nu er der ikke længere mulighed for at give hver enkelt sidekrop sine egne egenskaber (properties). De fleste brugere vil nok finde det hensigtsmæssigt ikke at skulle vedligeholde så mange Style Sheets, men omkostningen er så at du ikke kan tildele baggrundsfarve til hver enkelt side. Men som du måske allerede har erfaret efter at have arbejdet med g-link CMS, så er der næsten altid en "work-around" - en måde at opnå samme resultat, men på en anden måde. Her er et par forslag:

  1. Lav en tabel med én række og kun én celle. Sæt kant til 0 og bredden til 100% og baggrundsfarven til den ønskede farve. Så vil baggrunden for alt indholdet i cellen (som fylder hele bredden) få den ønskede farve.
     
  2. Opret en "Custom Class" som CSS-klasse og opmærk hele den blok, som du ønsker skal have en anden farve. Du kan her se mere om hvordan du opretter brugerdefinerede (custom) klasser. Ved at bruge Custom Classes opnår du desuden den fordel, at hvis du ønsker at lave noget om efterfølgende, så retter du bare din klasse. Herefter vil alle de elementer / blokke, som du har opmærket med din klasse ændres uden at du skal ind og redigere på hver enkelt side igen.
     
  3. Du kan også vælge at skrive din baggrundsfarve direkte ind i HTML-koden: Skift til "Kilde-visning" og find den blok, som du ønsker ændret baggrundsfarve på. Det kunne typisk være den første <p>-tag. Indsæt derefter en inline style således: 

    <p style="background-color: red;">

    hvilket giver en rød baggrundsfarve. Farverne kan angives med
    navngivne farver: red
    decimal notation: rgb(255,0,0)
    hexadecimal notation i 24 bit: #FF0000
    hexadecimal notation i 8 bit: #F00

    Det samme kan du gøre ved mange andre HTML-elementer. Hvis der ikke er et paasende HTML-element i kildekoden, så kan du i stedet bruge en <span>-tag, som netop er beregnet til at opmærke en blok, med særlige egenskaber. Så ser det blot sådan ud:

    <span style="background-color: #F00;"> den opmærkede bloks indhold </span>

Dette er et eksempel på en blok opmærket med rød baggrund og hvid tekst med skriftypen Courier, hvor span-tag´en ser således ud: </spanspan style="color: #FFFFFF; background-color: #FF0000; font-family: courier;">. Prøv selv at eksperimentere dig frem til det som virker bedst for dig og din side.

De giver selvfølgelig ikke en rød sidebaggrundsfarve - men så prøv alternativet med en tabel med rød baggrund i stedet - se eksemplet herunder:

Dette er et eksempel på en tabel med én række og én celle med rød baggrund og hvid tekst med skriftypen Courier, hvor td-tag´en ser således ud: <td bgcolor="#ff0000" style="color: #FFFFFF; font-family: courier;">.

Prøv selv at eksperimentere dig frem til det som virker bedst for dig og din side.

(af læsevenlighedsårsager er padding (afstand til kanterner sat til 16px)

 

Article written on 9. november 2005 by Anders
Article No. #10

Return....