• Register
    • Help

    striker  0 Items
    Currently Supporting
    • Home
    • News
    • Forum
    • Wiki
    • Support
      • Manage Subscriptions
      • FAQ
      • Support For
        • VaultWiki 4.x Series
        • VaultWiki.org Site
    • What's New?
    • Buy Now
    • Manual
    • 
    • Support
    • VaultWiki 3.x Series
    • Feature
    • Styling the Autolinked word

    1. Welcome to VaultWiki.org, home of the wiki add-on for vBulletin and XenForo!

      VaultWiki allows your existing forum users to collaborate on creating and managing a site's content pages. VaultWiki is a fully-featured and fully-supported wiki solution for vBulletin and XenForo.

      The VaultWiki Team encourages you to join our community of forum administrators and check out VaultWiki for yourself.

    Issue: Styling the Autolinked word

    • Issue Tools
      • View Changes
    1. issueid=1781 July 9, 2010 11:42 AM
      dvsDave dvsDave is offline
      Regular Member
      Styling the Autolinked word
      Would like the option apply CSS to the autolinked word

      On my old site where I used NuWiki, I had it setup so that I used CSS to create a dashed underline on the autolinked word and kept the font color the same as the regular text. It was a subtle method of conveying that the term was a link. My members find the straight link highlighting to be to "in your face" that it's a link.

      Where can I edit the styling on the autolinked words?
    Issue Details
    Issue Number 1781
    Issue Type Feature
    Project VaultWiki 3.x Series
    Category Styling / CSS
    Status Public Release
    Priority 5 - Minor Bugs / Small Tweaks
    Suggested Version 3.0.1
    Implemented Version (none)
    Milestone VaultWiki 3.0.5
    Software DependencyAny
    Votes for this feature 0
    Votes against this feature 0
    Attachments 0
    Assigned Users (none)
    Tags Style




    1. July 9, 2010 12:01 PM
      pegasus pegasus is offline
      VaultWiki Team
      Styling on wiki links is done in the template vw-links.css
      Reply Reply  
    2. July 9, 2010 2:02 PM
      dvsDave dvsDave is offline
      Regular Member
      Quote Originally Posted by pegasus
      Styling on wiki links is done in the template vw-links.css

      Code:
      /* ######## LINKS ######## */
      
      /* link on a redirect page */
      .redirectText { font-size: 18px; }
      
      /* text in the popup over wiki links */
      /* properties override inheritance from bb-code */
      .autolink_content {
      	color: {vb:stylevar body_color};
      	font-size: 12px;
      	font-style: normal;
      	font-weight: normal;
      	text-decoration: none;
      }
      
      /*** links using the [URL] BB-Code, based on link protocol ***/
      .link-http { background: url({vb:stylevar imgdir_vault}/external.png) center {vb:stylevar right} no-repeat; }
      .link-https { background: url({vb:stylevar imgdir_vault}/lock_icon.gif) center {vb:stylevar right} no-repeat; }
      .link-mailto { background: url({vb:stylevar imgdir_vault}/mail_icon.gif) center {vb:stylevar right} no-repeat; }
      .link-news { background: url({vb:stylevar imgdir_vault}/news_icon.png) center {vb:stylevar right} no-repeat; }
      .link-ftp { background: url({vb:stylevar imgdir_vault}/file_icon.gif) center {vb:stylevar right} no-repeat; }
      .link-irc { background: url({vb:stylevar imgdir_vault}/discussionitem_icon.gif) center {vb:stylevar right} no-repeat; }
      
      /* links to new (uncreated) articles */
      .autolink_content a.new, .postbody a.new { color: #cc0000; }
      
      /* footnote jump links */
      .reflist { font-size: 10px; }
      .reflist td { border: none; }
      
      .special_footnote a, .special_footnote a:hover,
      .special_ref_up a, .special_ref_up a:hover {
      	font-size: 9px;
      	color: {vb:stylevar shade_color};
      }
      
      a.ref_select {
      	color: {vb:stylevar foruminfo_background.backgroundColor};
      	background: {vb:stylevar body_color};
      }
      
      /* forum (list) links */
      .forumbit_post .foruminfo .forumdata .forumtitle a.vw-list-link,
      .forumbit_nopost .forumbit_nopost .forumrow .forumtitle a.vw-list-link {
      	font-weight: normal;
      	font-size: {vb:stylevar mid_fontSize};
      }
      Which class?


      I want to make the link like this:
      Code:
      (unhighlighted)
      color: {vb:stylevar body_color};
      text-decoration: none;
      border-bottom:  1px dashed {vb:stylevar body_color};
      
      (highlighted or clicked)
      color:{vb:stylevar link_color};
      text-decoration: none;
      border-bottom:  1px dashed {vb:stylevar link_color};
      Reply Reply  
    3. July 9, 2010 6:40 PM
      ctrlbrk ctrlbrk is offline
      Junior Member
      It is vw-link class

      Code:
      .vw-link {
              color: #26478c;
              text-decoration: none;
              border-bottom: 1px dashed;
      }
      If I remember right, it was missing on mine. I had to add it.

      Mike
      Reply Reply  
    4. July 12, 2010 11:10 AM
      dvsDave dvsDave is offline
      Regular Member
      Does not seem to affect it. It still has the default styling.
      This is what I added:
      Code:
      .vw-links {
             color: {vb:stylevar body_color} !important; 
             text-decoration: none !important; 
             border-bottom: 1px dashed {vb:stylevar body_color} !important; 
      }
      Reply Reply  
    5. July 12, 2010 11:55 AM
      pegasus pegasus is offline
      VaultWiki Team
      Your class name is plural. The class applied to the link itself is singular. See the post above yours again.
      Reply Reply  
    6. August 8, 2010 4:50 PM
      dvsDave dvsDave is offline
      Regular Member
      I updated the class name to singular, but still no dice.

      Code:
      /* ######## LINKS ######## */
      
      /* autolinks in forum */
      
      .vw-link a{
             color: {vb:stylevar body_color} !important; 
             text-decoration: none !important; 
             border-bottom: 1px dashed {vb:stylevar body_color} !important; 
      }
      Reply Reply  
    7. August 9, 2010 1:29 AM
      pegasus pegasus is offline
      VaultWiki Team
      .vw-link a is incorrect. The A tag is not inside a vw-link container, it is the vw-link. Just use .vw-link, you don't need to make the selector so specific.
      Reply Reply  
    + Reply

    Assigned Users
    Loading Please Wait
    Tags
    Loading Please Wait
    • Contact Us
    • License Agreement
    • Privacy
    • Terms
    • Top
    All times are GMT -4. The time now is 1:09 AM.
    This site uses cookies to help personalize content, to tailor your experience, and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Learn more… Accept Remind me later
  • striker
    Powered by vBulletin® Version 4.2.5 Beta 2
    Copyright © 2023 vBulletin Solutions Inc. All rights reserved.
    Search Engine Optimisation provided by DragonByte SEO (Pro) - vBulletin Mods & Addons Copyright © 2023 DragonByte Technologies Ltd.
    Copyright © 2008 - 2013 VaultWiki Team, Cracked Egg Studios, LLC.