FANDOM


  • I am looking for some help to add this image into the header of infoboxes and tables on the Xbox Wiki. For reference, something like the infoboxes and tables on this wiki'. If this isn't enough detail on what I am looking to do I will try and expand on it if needed. Any help will be appreciated.

      Loading editor
    • links to the infoboxes and tables would be helpful.

        Loading editor
    •   Loading editor
    • image into the header of infoboxes
      As you are using Europa Infobox theme, add this into MediaWiki:Wikia.css

      /* image in infobox header */
      .pi-europa .pi-title {
         background:url('https://vignette.wikia.nocookie.net/xbox/images/0/04/Xbox-grid.png/revision/latest?cb=20200323080457'); 
      }
      

      as per instructions at top of page, please purge your browser
      preview >> w:c:communitytest:Template:Console Template


      image into the header of tables
      Assuming you are using infobox wikitable like w:c:xbox:Grand_Theft_Auto_IV#Windows_version add this into MediaWiki:Wikia.css

      /* image in table header */
      .headerbg {
        background:url('https://vignette.wikia.nocookie.net/xbox/images/0/04/Xbox-grid.png/revision/latest?cb=20200323080457');
      }
      


      Add .headerbg into the rows requiring the background.
      As ! in header sets background color, change to | which will need some replacing styling

      {| class="infobox wikitable"
      | class="headerbg" colspan="2" style="color:white; text-align:center; font-weight:bold;" | Aggregate score
      
      ...
      

      preview >> w:c:communitytest:Table

        Loading editor
    • Thanks, I managed to get it to work in the infobox and tables with your help. I just have two more questions.

      1. Would it be possible to get the image to also work in this infobox as well? The template is very old and I wouldn't be surprised if it wasn't possible but I am still curious if an image could still be put in it.

      2. On this infobox or all infoboxes that use the newer looking format, can I change the color that the details are in. For example, in the link I have provided the color is greyish. Can I change this color to a darker one to match with the image?

        Loading editor
    • There are 2 coding variations

      1. CSS
      This includes "infobox wikitable" and Template:Infobox_VG. They are controlled by .headerbg. So any that wants the background just needs adding class="headerbg" in that row

      2. Portable Infobox
      This includes Template:Console_Infobox_2019. They are controlled by MediaWiki:Wikia.css. So any changes like background is made by changing the appropriate tag in MediaWiki:Wikia.css.
      The list of tags are here >> w:c:xbox:Help:Infoboxes/CSS#Main_classes

      /* portable infobox background */
      .pi-europa.pi-background {
         background: #XXXXXX; 
      }
      
        Loading editor
    • Sorry to bother you again but I can't seem to get the image to go into the header of the CSS infobox only the background, is there a specific spot it has to be put into?

      I have also managed to work out background colors on the portable infoboxes but is it possible to change the text color too so it can fit with the background color?

      Edit: I'm starting to figure out where the CSS infobox but still haven't looked into the different text color.

        Loading editor
    • I have also managed to work out background colors on the portable infoboxes but is it possible to change the text color too


      The bracket location in MediaWiki:Wikia.css becomes the styling location for each individual tag.

      This is the styling for "title" which currently is only background

      /* image in infobox header */
      .pi-europa .pi-title {
         background:url('https://vignette.wikia.nocookie.net/xbox/images/0/04/Xbox-grid.png/revision/latest?cb=20200323080457'); 
      }
      


      This is the styling for the whole infobox for its "background"

      /* portable infobox background */
      .pi-europa.pi-background {
         background: #d3e0d1; 
      }
      


      From the wiki help page pick the styling location

      • infobox theme → .pi-europa
      • tag → .pi-border-color
      /* portable infobox font-color */
      .pi-europa .pi-border-color {
         color: #XXXXXX; 
      }
      


      Near the top of MediaWiki:Wikia.css is the styling location for CSS infoboxes. It lists the most used tags

      /* Infobox template style */
      .infobox {
         border: 1px solid #aaaaaa;
         background-color: #f9f9f9;
         color: black;
         margin-bottom: 0.5em;
         margin-left: 1em;
         padding: 0.2em;
         float: right;
         clear: right;
      }
      
        Loading editor
    • TableWiz, I just want to thank you for all of the help you have given me. You have taught me so much about things that I have always been very confused about. You are really are a valuable part of this community. Thanks again for all of your help.

        Loading editor
    • A FANDOM user
        Loading editor
Give Kudos to this message
You've given this message Kudos!
See who gave Kudos to this message
Community content is available under CC-BY-SA unless otherwise noted.