Results 1 to 3 of 3

Thread: CSS styling for recommendation module

  1. #1
    User
    Join Date
    09-08-09.
    Location
    Snellville, GA
    Posts
    194

    Default CSS styling for recommendation module

    I'm having some issues with something that I thought would be fairly simple, styling the "Recommendation" module link.

    In the template file that's in the module, there is a css call for class="hyperlink_txt"...but of course, the module does NOT have an included style sheet for styling the link.

    When I style this class in a CSS sheet, the link text consistently wants to follow a UL styling. Not sure why that is, it may be a call in the modules code that is causing this. I've tried to declaring a separate id for the recommendation insert but it doesn't affect it.

    Anyone have any suggestions on what they've done to style this module previously?

  2. #2
    Experienced user
    Join Date
    06-10-09.
    Location
    Atlanta, Georgia
    Posts
    611

    Default Re: CSS styling for recommendation module

    Ernest,

    Can you give us a link to the page or post your html / css snippets?
    I'm going to move this thread over to the css category, btw.

    Off topic: It's good to see someone else nearby Atlanta using Contao.

  3. #3
    User
    Join Date
    09-08-09.
    Location
    Snellville, GA
    Posts
    194

    Default Re: CSS styling for recommendation module

    Good morning Ben!

    Thanks for the comeback. I see your posts on the forum all the time and yes it is good to know someone else here in the Atlanta area who uses Contao. I'm in Centerville section of Snellville not far from Stone Mountain.

    Okay I've got my problem solved after two hours working with the module and stylesheets. I've identified one small error in the module code and have an example below for styling the module. The website is one I just deployed for a sorority at East Carolina University:

    http://www.AlphaPhiECU.org/

    Right now the Recommendation link is on both the Home Page and the About Us page.

    1. PROBABLE CODE ERROR - While working through the style issues I noticed that when the link is inserted on a page, when I clicked on the link a new email message is created and the text in the email shows this:

    "I found this web page at <http://www.alphaphiecu.org//> which I thought you might like to see."

    Note the extra trailing forward slash at the end of the link. The link works in Firefox and IE8, but it might not in some browsers. The slash is inserted on line 52 of the ContentRecommendation.php file in the module:

    if (!preg_match("/.*\\/^/", $pageref)) $pageref .= '/';

    IF the page is the default page in Contao (e.g. home page) then the second slash appears. If the page is an internal page such as the About Us page on the site, then the recommendation link generates this text:

    "I found this web page at <http://www.alphaphiecu.org/index.php/about-us.html> which I thought you might like to see."

    This is a properly formatted link, but since we're using aliases I would think that the link could expressed as

    http://www.alphaphiecu.org/about-us.html without the "index.php/". In any event the second slash in the default page should not be there. I would expect the defaul page link to read the page alias if present (it is on this site) and insert the correct alias into the link.

    Your thoughts?

    2. STYLING - The module calls for a class for styling the link "hyperlink_txt" on line 8 in the ce_recommendation.tpl file which is apparently not declared anywhere (in terms of the css code) by the module on install. I'm using hard coded external stylesheets for layout and style that are called in the template files for the pages.

    The problem that I was running into was a cascade error associated with the a, a:link declarations on multiple Contao modules in the style sheet. Our artists provide our clients with fairly complex graphics and we have multiple styles on pages that can include links that have light over dark colors , or dark over light colors on the same page. Once I cleaned up the css in the style sheet, AND entered "hyperlink_txt" as the css class for the insert element at the bottom of the insert article element form, then the link finally styled properly:

    .hyperlink_txt {
    color: #7e9652;
    font-family: Corbel, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, "Verdana Ref", sans-serif;
    font-size: 1.15em;
    font-style: normal;
    letter-spacing: 0;
    line-height: 1.25em;
    }

    .hyperlink_txt a,
    .hyperlink_txt a:link {
    color: #7e9652;
    font-family: Corbel, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, "Verdana Ref", sans-serif;
    font-size: 1.15em;
    font-style: normal;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 1.25em;
    text-decoration: none;
    }

    .hyperlink_txt a:visited {
    color: #7e9652;
    font-size: 1.15em;
    font-weight: bold;
    text-decoration: none;
    }

    .hyperlink_txt a:hover {
    color: #7e9652;
    font-size: 1.15em;
    font-weight: bold;
    text-decoration: underline;
    }

    .hyperlink_txt a:active {
    color: #7e9652;
    font-size: 1.15em;
    font-weight: bold;
    text-decoration: none;
    }

    Thanks for your response, some sleep and fresh coffee this morning cleared my mind enough to where I could find the path to the cure. Hopefully this thread in the forum will help someone else in the future. I was about to give up on the link and just create an image link (I may do this anyway to call more attention to the link).

    Is there a way to submit the code error to the extension's developer?

    Ernest McDermon
    Snellville, GA "Where everybody is somebody!"

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •