Kryptronic Software Support Forum

You are viewing this forum as a guest. Login to an existing account, or create a new account, to reply to topics and to create new topics.

#1 12-05-2009 18:32:48

Design_Wholesale
Member
From: England!
Registered: 11-21-2008
Posts: 1104
Website

How Can I Style Error and Confirmation Messages?

Now I know that the first answer I am going to get with this is going to be along the lines of "use .css, stupid!" smile

...however, both types of message are called with the  function (not simply ), are contained within <p></p> tags in the code (not usually a problem in itself, but useful to know so I don't wrap the messages in <div> tags), and will not style. - Any tags, .css or otherwise, are simply printed and not parsed.

I have looked at  (not sure where the file is for the confirmation messages), the database entries, and several other core file entries but cannot see how I am supposed to add styling to the these messages.

Any help would be appreciated because the messages as they display at the moment are damned ugly and need something doing to them (and no, I'd rather not just remove them because they  serve a purpose!).

Last edited by Design_Wholesale (12-05-2009 18:37:54)

Offline

 

#2 12-05-2009 19:40:28

sppars
Member
Registered: 01-25-2006
Posts: 301

Re: How Can I Style Error and Confirmation Messages?

They're controlled by the "Generic Message" include found at "Displays: Skins, Menus, XHTML Includes and Messages > Manage XHTML Includes." The messages themselves are under "Displays: Skins, Menus, XHTML Includes and Messages > Manage System Messages" which you can use their identifier to create specific conditional formatting in the include.

Offline

 

#3 12-05-2009 20:25:49

Design_Wholesale
Member
From: England!
Registered: 11-21-2008
Posts: 1104
Website

Re: How Can I Style Error and Confirmation Messages?

Thank-you - much appreciated.

Last edited by Design_Wholesale (08-12-2010 06:10:14)

Offline

 

#4 02-19-2011 14:36:42

jensme
Member
Registered: 04-29-2010
Posts: 392

Re: How Can I Style Error and Confirmation Messages?

I edited the Display Include for this, but it doesn't seem to be editing the message.  When I go to View Source, the <p> still shows up.  Help?

Offline

 

#5 02-19-2011 15:00:45

Design_Wholesale
Member
From: England!
Registered: 11-21-2008
Posts: 1104
Website

Re: How Can I Style Error and Confirmation Messages?

When you say you edited the display include what do you mean? - Did you just change one or more of the messages, or did you literally do something to the message function itself?

On my site I just changed the messages, and then modified the CSS to improve the aesthetic side of things. - I did not need to mess around changing the coding for anything.

I don't know if it will help, but this is the CSS I use for message displays on our site:


Code:

/* +------------------------------------------------------------+ */
/* | KHXC Required Classes: Messages                            | */
/* +------------------------------------------------------------+ */

.khxc_error {
     color: #FF0000;
     font-weight: bold;
     text-align: justify;
     }

.khxc_confirm {
     color: #339933;
     font-weight: bold;
     text-align: justify;
     }

Last edited by Design_Wholesale (02-19-2011 15:04:20)

Offline

 

#6 02-19-2011 15:24:05

jensme
Member
Registered: 04-29-2010
Posts: 392

Re: How Can I Style Error and Confirmation Messages?

Thanks for this.  I need to somehow change it to ids, not classes.  I'm using divs because I want to float it over everything else.  Can't do that with classes.  I don't think.

I actually changed the System Dashboard > System > Displays > Display Includes > Generic Message file.

Offline

 

#7 02-19-2011 15:47:11

Design_Wholesale
Member
From: England!
Registered: 11-21-2008
Posts: 1104
Website

Re: How Can I Style Error and Confirmation Messages?

First, no problem, - glad to help if I can.

I am fairly certain that you cannot have XHTML content in the message boxes (plain text only), and for the ids you need to remember that a page can have multiple instances of a class, but only one instance of an id.  Also, in the CSS file, classes should be prefixed by  or in the case of ids, :

.message_class {
...
...
                        }

#message_id {
...
...
                     }

Last edited by Design_Wholesale (02-19-2011 15:50:39)

Offline

 

#8 02-19-2011 15:59:13

jensme
Member
Registered: 04-29-2010
Posts: 392

Re: How Can I Style Error and Confirmation Messages?

Right.  But since I can't seem to change the <p> before the message text and add something before it (a div tag, for instance), I can't change that text, correct?

Offline

 

#9 02-19-2011 16:02:12

jensme
Member
Registered: 04-29-2010
Posts: 392

Re: How Can I Style Error and Confirmation Messages?

Come to think of it, I'll also need to add a "close window" link on it.

Offline

 

#10 02-19-2011 16:19:34

Design_Wholesale
Member
From: England!
Registered: 11-21-2008
Posts: 1104
Website

Re: How Can I Style Error and Confirmation Messages?

If you are wanting to float something then you should be able to use divs or classes, - it does not matter which.

I think it might be easiest if you were to post the code for the page you are trying to modify and to tell me which part needs to float. - I have just spent the last 10 minutes trying to find an example of the message code and cannot locate one ...so you could post the code you are trying to modify I should be able to show you what you need to do with it.

Offline

 

#11 02-19-2011 16:22:25

jensme
Member
Registered: 04-29-2010
Posts: 392

Re: How Can I Style Error and Confirmation Messages?

I don't have the code - that's part of the problem.  I want to modify the way messages display and add some stuff to it, add a "close" option for the floating box, etc.  I need to track down wherever that code actually is in the system.

Right now, before an error or confirm message, there's a <p class="[error/confirm]".  I want to change it to a div and add a link to the bottom of it so people can close the message.

Offline

 

#12 02-19-2011 16:30:00

Design_Wholesale
Member
From: England!
Registered: 11-21-2008
Posts: 1104
Website

Re: How Can I Style Error and Confirmation Messages?

Ah, you need  in the  directory.

Offline

 

#13 02-19-2011 16:31:34

Design_Wholesale
Member
From: England!
Registered: 11-21-2008
Posts: 1104
Website

Re: How Can I Style Error and Confirmation Messages?

You might want to change the file contents to something more like:


Code:

<?php 

$msg  = $this->xhtml_encode($this->globals('ecom.print_message_content'));
$type = $this->globals('ecom.print_message_type');

$eol  = $this->globals('khxc.eol');

if ($type == 'CONFIRM') {

     print '<div class="khxc_confirm">' . $msg . '</div>' . $eol . $eol;


} else {

     print '<div class="khxc_error">' . $msg . '</div>' . $eol . $eol;

} // End of if statement.

?>

with the following in your CSS:


Code:

/* +------------------------------------------------------------+ */
/* | KHXC Required Classes: Messages                            | */
/* +------------------------------------------------------------+ */

.khxc_error {
     float: right;
     clear: right;
     color: #ff0000;
     font-weight: bold;
     text-align: justify;
     }

.khxc_confirm {
     float: right;
     clear: right;
     color: #339933;
     font-weight: bold;
     text-align: justify;
     }

can be left or right and, in simple terms, is not necessary unless you have the box moving up against items on the left or right which should be on seperate lines.

Last edited by Design_Wholesale (02-19-2011 16:35:04)

Offline

 

#14 02-19-2011 16:34:18

jensme
Member
Registered: 04-29-2010
Posts: 392

Re: How Can I Style Error and Confirmation Messages?

I did that.  The problem is, it didn't take from Generic Messages in Display Includes.  At all.  It retained a <p> that's there if you view the source code from the page.  It's as if Generic MEssages doesn't apply to confirm/error messages.

Is that making sense?

So it's as though the display include is for something else entirely and there's another place to update error/confirm messages.

Offline

 

#15 02-19-2011 16:36:50

Design_Wholesale
Member
From: England!
Registered: 11-21-2008
Posts: 1104
Website

Re: How Can I Style Error and Confirmation Messages?

There are three types of message: error, normal, and confirm.

Try extending both the code and the CSS to include  and see what happens.


Code:

<?php 

$msg  = $this->xhtml_encode($this->globals('ecom.print_message_content'));
$type = $this->globals('ecom.print_message_type');

$eol  = $this->globals('khxc.eol');

if ($type == 'CONFIRM') {

     print '<div class="khxc_confirm">' . $msg . '</div>' . $eol . $eol;

} elseif ($type == 'NORMAL') {

     print '<div class="khxc_normal">' . $msg . '</div>' . $eol . $eol;

} else {

     print '<div class="khxc_error">' . $msg . '</div>' . $eol . $eol;

} // End of if statement.

?>

...alternatively...


Code:

<?php 

$msg  = $this->xhtml_encode($this->globals('ecom.print_message_content'));
$type = $this->globals('ecom.print_message_type');

$eol  = $this->globals('khxc.eol');

if ($type == 'CONFIRM') {

     print '<div class="khxc_confirm">' . $msg . '</div>' . $eol . $eol;

} elseif ($type == 'ERROR') {

     print '<div class="khxc_error">' . $msg . '</div>' . $eol . $eol;

} else {

     print '<div class="khxc_normal">' . $msg . '</div>' . $eol . $eol;

} // End of if statement.

?>

Last edited by Design_Wholesale (02-19-2011 16:42:52)

Offline

 

#16 02-19-2011 16:54:37

jensme
Member
Registered: 04-29-2010
Posts: 392

Re: How Can I Style Error and Confirmation Messages?

I even added some nonsense text in there.  The fact of the matter is, it's just not pulling from that include.  It's obviously coming from somewhere else, but I have no idea where.

Offline

 

#17 02-19-2011 17:01:23

Design_Wholesale
Member
From: England!
Registered: 11-21-2008
Posts: 1104
Website

Re: How Can I Style Error and Confirmation Messages?

Do you actually have a normal type of message? - In my store every message type is either error or confirm ...and if you have not added any normal type messages you are not going to get anything to display for normal type message display.

Offline

 

#18 02-19-2011 17:06:29

Design_Wholesale
Member
From: England!
Registered: 11-21-2008
Posts: 1104
Website

Re: How Can I Style Error and Confirmation Messages?

I have just used the above code and changed the message type on  to . - As I do not have any CSS rules in place for  it printed, as expected, in the default plain grey text ...so what I have given you does work, even if it won't in your store for some reason.

Last edited by Design_Wholesale (02-19-2011 17:07:10)

Offline

 

#19 02-19-2011 19:04:21

jensme
Member
Registered: 04-29-2010
Posts: 392

Re: How Can I Style Error and Confirmation Messages?

I don't know.  I do have CC7, for one thing.  For another, I added dummy text to every possible result on the Generic Message Display and the messages don't change.  It's just not picking them up at all.

Offline

 

#20 02-19-2011 19:05:51

jensme
Member
Registered: 04-29-2010
Posts: 392

Re: How Can I Style Error and Confirmation Messages?

Here's the code as it is now.  Thoughts?

Code:

<?php 

$msg  = $this->xhtml_encode($this->globals('ecom.print_message_content'));
$type = $this->globals('ecom.print_message_type');

$eol  = $this->globals('core.eol');

if ($type == 'CONFIRM') {

     print '<div class="confirm">1234' . $msg . '</div>' . $eol . $eol;

} elseif ($type == 'NORMAL') {

     print '<div class="confirm">qwer. $msg . '</div>' . $eol . $eol;

} else {

     print '<div class="error">asdd' . $msg . '</div>' . $eol . $eol;

} // End of if statement.

?>

Offline

 

#21 02-19-2011 19:21:23

jensme
Member
Registered: 04-29-2010
Posts: 392

Re: How Can I Style Error and Confirmation Messages?

And here's what view source spits out:

"<p class="confirm">Thank you.  The address you entered has been added to your delivery address book.</p>"

Offline

 

#22 02-20-2011 16:12:36

Design_Wholesale
Member
From: England!
Registered: 11-21-2008
Posts: 1104
Website

Re: How Can I Style Error and Confirmation Messages?

Try going to  and changing  to message type .  If that does not work, and assuming that you are using CCP 6.0, and that you have modified the  file as detailed above (making any necessary amendments to your CSS) I truly do not know what to suggest. - I have tested the modification in my own store and can confirm that, yes, it does work ...so if it will not work in your store, and assuming the above conditions to be true, I can only think that you are either entering something incorrectly or that something else in your store is controlling the system messages (which, outside of modfications to the store, should not be the case).

Last edited by Design_Wholesale (02-20-2011 16:14:20)

Offline

 

Board footer