How Can I Modify These Links?

08 Nov 2012, 04:42

#1

Totally Zenned

Join Date:: May 2012
Posts:: 566
Plugin Contributions:: 0

How Can I Modify These Links?

I’d like to modify the following links.

On the Product Info Page, right under the breadcrumb trail and to the left, where the category icon would be, there is the manufacturers name. It is also a link. If it linked to the manufacturers other products, it would make more sense, but it just takes you to the main page. I actually have a link to that manufacturer just a few inches away, so to have a second one would be redundant.

Is there a way to remove the manufacturers name from this spot? If not, can I remove the link and just have it as a name?

Also on the Product Info Page, is the Prev/See All Products By This Designer/Next links. They work fine, but since they are links, I would like them to have the same hover color as my other links: #ed3a84. I tried getting a clue where to place that using Firebug, but struck out. See All Products By This Designer was Return To The Product List before I changed the name, if that matters.

http://designerperfumesnob.authsafe.com/white-diamonds-eau-de-toilette-spray-17-oz-by-elizabeth-taylor-for-women-p-4040.html

On the Main Page:

http://designerperfumesnob.authsafe.com/

Shop Our Sale in the CenterBox is the link that leads nowhere. I’d like it to hover #ed3a84 and take you to:

http://designerperfumesnob.authsafe.com/specials.html

If you can help me accomplish these things I’d be grateful. Thank you.

08 Nov 2012, 05:36

#2

kobra

Black Belt

Join Date:: Aug 2005
Posts:: 31,500
Plugin Contributions:: 4

Re: How Can I Modify These Links?

right under the breadcrumb trail and to the left, where the category icon would be, there is the manufacturers name

admin > catalog > product types > general > edit layout > Show Manufacturer > set to false

08 Nov 2012, 06:14

#3

traytray

Totally Zenned

Join Date:: May 2012
Posts:: 566
Plugin Contributions:: 0

Re: How Can I Modify These Links?

kobra:
admin > catalog > product types > general > edit layout > Show Manufacturer > set to false

That is exactly how it is set. How can it still show??

http://designerperfumesnob.authsafe.com/violetta-di-parma-talc-34-oz-by-borsari-for-women-p-2997.html

08 Nov 2012, 08:42

#4

kobra

Black Belt

Join Date:: Aug 2005
Posts:: 31,500
Plugin Contributions:: 4

Re: How Can I Modify These Links?

Well that is not specifically the manufacturer - it is text in place of an icon
Add this to the end of your stylesheet

#categoryIcon {
        display: none;  
        }

08 Nov 2012, 09:10

#5

traytray

Totally Zenned

Join Date:: May 2012
Posts:: 566
Plugin Contributions:: 0

Re: How Can I Modify These Links?

Thank you Kobra. Another thing I can cross off the list.

Still looking for help for the following:

On the Product Info Page, is the Prev/See All Products By This Designer/Next links. They work fine, but since they are links, I would like them to have the same hover color as my other links: #ed3a84. I tried getting a clue where to place that using Firebug, but struck out. See All Products By This Designer was Return To The Product List before I changed the name, if that matters.

http://designerperfumesnob.authsafe....en-p-4040.html

On the Main Page:

http://designerperfumesnob.authsafe.com/

Shop Our Sale in the CenterBox is the link that leads nowhere. I’d like it to hover #ed3a84 and take you to:

http://designerperfumesnob.authsafe.com/specials.html

If you can help me accomplish these things I’d be grateful. Thank you

09 Nov 2012, 04:38

#6

gjh42

Black Belt

Join Date:: Jul 2005
Posts:: 21,876
Plugin Contributions:: 6

Re: How Can I Modify These Links?

The prev/next links all have a class of .navNextPrevList, so you can't directly address just one of them. You can control them individually with selectors like

p+.navNextPrevList {}
p+.navNextPrevList+.navNextPrevList {}
p+.navNextPrevList+.navNextPrevList+.navNextPrevList {}

for the first, second and third links.

09 Nov 2012, 04:51

#7

gjh42

Black Belt

Join Date:: Jul 2005
Posts:: 21,876
Plugin Contributions:: 6

Re: How Can I Modify These Links?

For the Shop Our Sale link, there is already a blank rule in stylesheet_module_tabs.css:

#moduleMenu span a:hover {}

Just add your color to that.

The link destination will have to be set in the custom javascript file for the mod.

09 Nov 2012, 06:21

#8

traytray

Totally Zenned

Join Date:: May 2012
Posts:: 566
Plugin Contributions:: 0

Re: How Can I Modify These Links?

Sorry to be so naive. For the following, I am looking to get a hover color for all three. Would I use the last one of the three listed and paste it to the bottom of the stylesheet? Do I just add the color # in the brackets? Don't I need to add the hover?

p+.navNextPrevList {}
p+.navNextPrevList+.navNextPrevList {}
p+.navNextPrevList+.navNextPrevList+.navNextPrevList {}

clueless~

09 Nov 2012, 07:27

#9

gjh42

Black Belt

Join Date:: Jul 2005
Posts:: 21,876
Plugin Contributions:: 6

Re: How Can I Modify These Links?

If you want the same styling for all three, just add a rule for

.navNextPrevList:hover {color: #aabbcc;}

pretty much anywhere in your stylesheet. A place where it is easy to find would be good, either with rules for similar/related elements or at the bottom of the stylesheet.

09 Nov 2012, 07:51

#10

traytray

Totally Zenned

Join Date:: May 2012
Posts:: 566
Plugin Contributions:: 0

Re: How Can I Modify These Links?

gjh42:
If you want the same styling for all three, just add a rule for

.navNextPrevList:hover {color: #aabbcc;}

pretty much anywhere in your stylesheet. A place where it is easy to find would be good, either with rules for similar/related elements or at the bottom of the stylesheet.

Entered:

.navNextPrevList:hover {color: #ed3a84;}

to bottom of stylesheet and still no hover color. Crazy how a simple thing like this causes so much frustration.

http://designerperfumesnob.authsafe.com/calvin-klein-beauty-eau-de-parfum-spray-1-oz-by-calvin-klein-for-women-p-3613.html

09 Nov 2012, 08:05

#11

gjh42

Black Belt

Join Date:: Jul 2005
Posts:: 21,876
Plugin Contributions:: 6

Re: How Can I Modify These Links?

Okay, you want an image to change color on hover. CSS can't do that. It could switch the background-image to a different one, or shift it so that a differently-colored version comes into view, but it can't change a foreground image.

You have image buttons for the links, even though they are identical to what you would get with text.

09 Nov 2012, 10:16

#12

traytray

Totally Zenned

Join Date:: May 2012
Posts:: 566
Plugin Contributions:: 0

Re: How Can I Modify These Links?

I understand. I replaced an image with a different image and neither had the hover feature. I didn't realize I could use text. Would it then be able to get a hover color? If so, how would I change it to text?

09 Nov 2012, 17:19

#13

gjh42

Black Belt

Join Date:: Jul 2005
Posts:: 21,876
Plugin Contributions:: 6

Re: How Can I Modify These Links?

I investigated the long convoluted chain of button use, and there doesn't appear to be a way to just substitute text for the image.
You would need to edit /includes/templates/your_template/templates/tpl_product_next_previous.php in this area: [PHP]
<p class="navNextPrevCounter"><?php echo (PREV_NEXT_PRODUCT); ?><?php echo ($position+1 . "/" . $counter); ?></p>
<div class="navNextPrevList"><a href="<?php echo zen_href_link(zen_get_info_page($previous), "cPath=$cPath&products_id=$previous"); ?>"><?php echo $previous_image . $previous_button; ?></a></div>

<div class="navNextPrevList"><a href="<?php echo zen_href_link(FILENAME_DEFAULT, "cPath=$cPath"); ?>"><?php echo zen_image_button(BUTTON_IMAGE_RETURN_TO_PROD_LIST, BUTTON_RETURN_TO_PROD_LIST_ALT); ?></a></div>

<div class="navNextPrevList"><a href="<?php echo zen_href_link(zen_get_info_page($next_item), "cPath=$cPath&products_id=$next_item"); ?>"><?php echo $next_item_button . $next_item_image; ?></a></div>[/PHP] Replace the
<?php echo $previous_image . $previous_button; ?>
and similar parts with the text you want. The quick and dirty way would be to put the text directly in the code; if you want to use the official method, or use multiple languages, you need to echo constants which you then define in a language file. You can use BUTTON_RETURN_TO_PROD_LIST_ALT, BUTTON_PREVIOUS_ALT and BUTTON_NEXT_ALT for the text (/includes/languages/english/button_names.php). [PHP]
<p class="navNextPrevCounter"><?php echo (PREV_NEXT_PRODUCT); ?><?php echo ($position+1 . "/" . $counter); ?></p>
<div class="navNextPrevList"><a href="<?php echo zen_href_link(zen_get_info_page($previous), "cPath=$cPath&products_id=$previous"); ?>"><?php echo BUTTON_PREVIOUS_ALT; ?></a></div>

<div class="navNextPrevList"><a href="<?php echo zen_href_link(FILENAME_DEFAULT, "cPath=$cPath"); ?>"><?php echo BUTTON_RETURN_TO_PROD_LIST_ALT; ?></a></div>

<div class="navNextPrevList"><a href="<?php echo zen_href_link(zen_get_info_page($next_item), "cPath=$cPath&products_id=$next_item"); ?>"><?php echo BUTTON_NEXT_ALT; ?></a></div>[/PHP]

09 Nov 2012, 21:48

#14

traytray

Totally Zenned

Join Date:: May 2012
Posts:: 566
Plugin Contributions:: 0

Re: How Can I Modify These Links?

I'm just curious. Remember when we did this:

For the Shop Our Sale link, there is already a blank rule in stylesheet_module_tabs.css:

#moduleMenu span a:hover {}

That is an image. Looks like it is using css to create a hover. How does that differ?

10 Nov 2012, 00:43

#15

gjh42

Black Belt

Join Date:: Jul 2005
Posts:: 21,876
Plugin Contributions:: 6

Re: How Can I Modify These Links?

The ribbon is a background image with foreground text on top of it. The text can change colors; a foreground image can't.

10 Nov 2012, 03:02

#16

traytray

Totally Zenned

Join Date:: May 2012
Posts:: 566
Plugin Contributions:: 0

Re: How Can I Modify These Links?

I understand and I learned a lot. Thank you.