How do I change the color scheme on Reftagger?

Carla P
Carla P Member Posts: 10 ✭✭
edited November 2024 in English Forum

I am not very familiar with HTML but need to know how to change the color scheme for the scripture popup box when using Reftagger.  Anyone?

Comments

  • Jonathan Pitts
    Jonathan Pitts Member Posts: 670 ✭✭

    The information you need is at http://reftagger.com/#customize.

    As it says there, you need to add one line to the Reftagger script, telling it to ignore the default styles. You then add the cascading style sheet (CSS) instructions for Reftagger (http://bible.logos.com/Content/ReferenceTagging.css) to the style sheet for your website.

    You can then edit the CSS to match your preferences. Any colour name in the CSS you can change to either a colour name or a hexadecimal colour code (for example, #FFFFFF for white, #000000 for black). For each element you can set colours for "color" (the text), "background" and "border".

    For a good introduction to CSS, look at http://www.w3schools.com/css/.

  • Carla P
    Carla P Member Posts: 10 ✭✭

    Jonathan, thanks so much for taking the time to answer. I saw these instructions and tried to do it...but then reftagger stopped working completely.  I guess I need a little more hand-holding since I'm very weak on HTML language skills.  Where do I place the script that tells it to ignore the default styles?  And do I copy that entire page of CSS instructions?  Where do I edit the CSS to match my preferences?  It's a bit overwhelming to me.  Thanks again.

  • Jonathan Pitts
    Jonathan Pitts Member Posts: 670 ✭✭

    Tell me how you have created the website, how you control the styles on the site, and how you added Reftagger to it. I write sites from the raw HTML, but it may be more difficult to control the styles if you are using software to write the page.

    The Reftagger script goes at the bottom of your HTML page, just before the </body> tag. The extra line goes within the main Reftagger script, somewhere between the < script > and </script> tags. Make sure it is on a line of its own and has the semicolon after it.

    The CSS goes wherever the CSS for your page is—again it depends how you created the site. Usually CSS is in a separate file, which is called by a line in the head section of the webpage. Alternatively, CSS commands can go in a < style > tag in the HTML itself. Paste all of the contents of the Reftagger CSS file after the main CSS for the site.

  • Carla P
    Carla P Member Posts: 10 ✭✭

    I'm using Biz Studio - it's for people like me who don't know HTML.  I put the reftagger code in the footer and it worked perfectly till I tried to change the color scheme.  I put the override default line right where you said to - right after <script type="text/javascript"> - on it's own line with a semicolon after it.  Then right after that I put in all the CSS stuff and changed the colors per the instruction page.  Reftagger stopped working.  So I deleted all the code and went back to the basic and it works fine.  I've tried putting it above and below the other code that's between <script type="text/javascript"> and </script>.  I also tried inserting a < style > tag above and below...tried just above, and I tried < style= so I don't know what I'm doing wrong.  Any ideas?

  • Jonathan Pitts
    Jonathan Pitts Member Posts: 670 ✭✭

    The <style> </style> tags, with CSS in between, need to be within the <head> </head> tags at the top of the page. So does the <link> tag if you want to link to an external style sheet.

    http://www.w3schools.com/css/css_howto.asp shows you the various ways of inserting CSS. An external style sheet is better if there is more than one page on your site, otherwise the CSS has to be on every page. The external style sheet is the file you downloaded from Reftagger website; it can be edited with Notepad or similar and uploaded into the same folder as your HTML pages.

    Read through the whole CSS Basics section, and things should start to make sense.

    I don't have any experience of your software and what it is capable of.

  • Carla P
    Carla P Member Posts: 10 ✭✭

    The footer is programmed to repeat on each page - there are no <head> </head> tags visible.  I'm thinking that much of the programming is internal and not accessible to me, due to the "for dummies" kind of web host it is...Maybe I just need to stick with the default.  Thanks for your time and for sharing your knowledge!

  • Dan Lankford
    Dan Lankford Member Posts: 1 ✭✭

    It looks like no answer was ever determined for this problem, but I'd like to bring it up again. My issue is that Reftagger is giving me a default color scheme of white text on a white background. You can highlight the text and read it, but what good is that?

    I'm using the Reftagger plugin. Anybody know how to change the default scheme without having to write enough code to rival Lord of the Rings for word count?

  • David Carter
    David Carter Member Posts: 1,099 ✭✭✭

    My issue is that Reftagger is giving me a default color scheme of white text on a white background.

    I rather suspect it's your stylesheet which is doing that. The element that controls the display of the text in reftagger (resourcetext) doesn't actually have any style rules associated with it.

    I just installed reftagger on a test post on one of my blogs and the default behavior is not white on white.

    If you'd care to post the url of a specific blog post I could probably identify the problem for you.