X-Cart forums

[nabeelaejaz]

I have tried for hours searching to change the color of this title. To my dismay I couldnt and am really frustrated now. Anyone can please point out the place to change this color to white, also the footer text. Thank you.

http://rawpk.com/up/img/8938css.gif

[balinor]

Title is .VertMenuTitle

Footer depends on how you have it set....probably .bottom

[carpeperdiem]

the way you can figure this out on your own is WEBMASTER MODE, and a little understanding of html/smarty -- but you don't have to "know" smarty -- just learn how to read and identify elements.

in WEBMASTER MODE -- you will discover which templates are responsible for the menu boxes. Then you'll clearly see that all of these "menu" boxes all call on a template called menu.tpl -- so look in menu.tpl and you'll see the $menu_title has the class, .VertMenuTitle

This is x-cart 101. May I suggest you grasp the skills needed to identify a css class or else you're going to be frustrated with x-cart.

If you are not using an FTP client that has a linked or integrated text editor, you probably should get one ASAP. You will be miserable without this tool.

Goog luck.

[paula]

Another Newbie. A Designer, alas, not a programmer.

I'm just trying to get oriented. I mistakenly assumed that because I work pretty comfortably in HTML and CSS that I would be able to make sense of things. But apparently I need to know php as well. My bad.

Okay, here's what I'm trying to clarify. I am a web designer, working through another company that has actually installed my client's copy of X-cart Gold on their server. They will ultimately connect it to my client's in-store POS system which will work in sync with the webstore we're building. I built and manage my client's existing static html website, which will now link to an online store.

My current task is to try to get the skin to have some visual relationship to my client's existing website. It appears that my choices are to: 1. purchase a pre-developed skin from X-Cart (but they don't really work visually with my client's design); 2. purchase customization services from either X-Cart or someone else; 3. try to modify the default template myself. I am taking a shot at #3.

I am perfectly satisfied with the layout of the default template, and the fonts, etc. I just want to change the colors. Instead of the pale yellow page background I want it to be white. Instead of the various golds/oranges/rusts, I want to use some pinks, roses and greys. Instead of the dark brownish text, I want to use an eggplant (330033). I don't care what the admin side looks like, I'm concerned with what customers see.

I work with GoLive to build sites and that's the environment I'm used to.

Carpe Diem mentions using an ftp client and text editor - can I use GoLive? How do I do that? Do I get server coordinates and download templates onto my hard drive and work on them in GoLive?

It took me awhile to grasp that since the store will be dynamic, it's not really a matter of working on pages, it's a matter of working on items that will be assembled on pages. I have read the very limited instructions in the manual, and have tried working with the Debugger and in the webmaster mode, and I have read Balinor's guide in this forum. I grasp that there are all of these individual templates, but when I open most of them, they don't appear to have any coding that includes colors. They have the php coding, right? But if I want to change the colors of the elements on the page - the head or foot or the various boxes, where is that coding? If I want the page color to be white (FFFFFF) instead of the pale yellow (FFFFBD3), where do I make that change? The only thing I have done successfully is insert my client's logo, and change the primary text color. Those changes were made in the skin1.css

I thought I could make other changes in there, but although I changed a bunch of colors, they must not have been for what I thought they were because the didn't seem to change what I thought I was changing.

Also, how in the heck will I know that I have changed all the necessary templates?

I appreciate any clarification I can get! Thanks!

[carpeperdiem]

I work with GoLive to build sites and that's the environment I'm used to.

Carpe Diem mentions using an ftp client and text editor - can I use GoLive? How do I do that? Do I get server coordinates and download templates onto my hard drive and work on them in GoLive?

Run! Run! Run away from GoLive!

It will mangle your code...

There is a way to keep it from ruining your code, see this post: http://forum.x-cart.com/showthread.php?t=6297&highlight=golive

Now, let's assume you can be coaxed into giving up golive (I'm an ex-golive user, now using dreamweaver for things that I can't simply hard code)...

1. Get an FTP client that has an integrated, or linked text editor. ON the mac, TRANSMIT is a very good ftp client, and it integrates very nicely with TEXTWRANGLER - I don't know a comparable solution for Windows... maybe CuteFTP?

2. Give up wysiwyg. You don't really need it for 95% of your work in xcart. For the 5% that it can be useful, copy the html, take it to dreamweaver, or golive if you have the filter installed (but be very careful), then bring it back via your text editor/ftp client.

3. Give up wysiwyg. Yes, it's time to look at your code and realize that your work in golive is bloated, and you can do better without it.

4. Give up wysigig. Uh, this Carpeperdiem (please note, my username, there's a "per" in there, changes the meaning of the phrase...) guy is a jerk... no, I'm actually here to share, to learn, and to give back when I can. I wish someone gave me some tough love earlier in my journey.

5. Now that you are looking at the templates in webmaster mode, get a HUGE piece of posterboard -- get a few -- so you can do this in a few different ways -- now, dissect x-cart -- use your own codes and colors -- but diagram how it all fits together... in your own pen. You'll learn to really love/hate the nested templates. Nested tables, etc... WHY, you ask? This is the ONLY way to quickly learn the structure. BUT I'M NOT A PROGRAMMER! Trust me, this isn't programming. Editing html and smarty and CSS is just a step removed from basic web design. YOU DO NOT NEED TO GO ANYWHERE NEAR the php code, with minor exceptions, and then, it's about simple mods.

6. Ok, now, use Webmaster mode, find the template that needs changing, find the css if needed, edit your css, if needed - make a new class. There you go....

7. You may need to look in the LANGUAGE file of the admin... if you have been brought in simply as a designer, and not the xcart admin, time to get friendly with the xcart admin and make an arrangement -- you will need to get into the admin for some tasks... some editing requires a trip to the langauges....

8. Did I mentioned it's time to give up wysiwyg?

Good luck -- there are lots of smart folks up here always willing to help.

Jeremy

[paula]

Jeremy: first, thank you for responding. Second, thank you for responding in a humorous and encouraging way. (I mean this sincerely.)

Now, I'll go have the vapours for awhile (pause while hysterics ensue)...

I'm back.

Okay. I wanted to get my bearings and you have definitely gotten me started on the path of figuring out whether there's any point in my trying to master this or whether I just pony up the dough for someone else to make the changes I want.

First I think you have confirmed what I had suspected, which is that there's nothing easy or intuitive about modifying the X-Cart templates. In point of fact, it demands a substantial investment in time and effort and a certain amount of technical knowledge. It's easy, perhaps, in the way that painting a wall is easy, once you've bought the plans, had the house built, had the interior finished, read a how-to book on interior painting, bought the paint and brushes and primer and tape, applied the primer and tape and are now dipping the paintbrush into the can of paint.

It appears that, before I can actually replace FFFBD3 with FFFFFF, I have to first figure out essentially the structure of the templated site. I have to go through "page by page" and determine what elements are on that page, and what images etc. are linked to that page, and what CSS has been applied. This is how I'm interpreting your advice - am I correct? I know there's "guidance" in the form of the list or tree on the debugging console, but I have to work through the tree for each "page" and interpret the names of templates, etc. right? Basically it's like downloading a site somone else built and figuring out every element of how they built it.

Also, before going any further, can you explain why I need a text editor and ftp client? I don't understand where that fits into all this. I did figure out that I can edit code in X-Cart. Are you copying code from X-Cart, pasting it into your editor, editing it and then replacing it in X-Cart? If so, why?

And why would I need to make a new class? I don't want to change the structure of pages at all, just the colors.

(Re: wysiwyg. I understand your point. But for my purposes now, all I'm concerned with is changing colors on this template. I didn't go into this intending to become an X-cart expert and, indeed, at the moment I'm contemplating running screaming in the opposite direction.)

I have to go meet some people so I won't be able to post anymore this evening, but if you could answer my questions re: the text editor and the classes, I'd really appreciate it. I will be letting all this percolate overnight and decide whether to post some additional specific questions, or just give the thing up.

Thanks again -

[carpeperdiem]

Originally Posted by paula

Also, before going any further, can you explain why I need a text editor and ftp client? I don't understand where that fits into all this. I did figure out that I can edit code in X-Cart. Are you copying code from X-Cart, pasting it into your editor, editing it and then replacing it in X-Cart? If so, why?

Easy.

1. An ftp client and text editor are but 2 of the "features" of GoLive. BUT - golive also has an opinion about how html should look (and it doesn't always respect current xhtml standards), and it also doesn't know (therefore doesn't like) smarty.

2. an ftp client gives you the power/flexibility to move files, rename, deal with permissions, etc... and it only does what you tell it to do. GoLive will always have an opinion.

3. Although GoLive has some powerful find/replace functions, it is nowhere near as powerful as the most basic of text editors - which will allow real time editing of files, live on the server. No need to upload, or update or reconcile.

And why would I need to make a new class?

What if the class is used in more than one page? What if you only want to change a single instance of the element? What if you want the .VertMenuTitle on the left side of the page to have one style, and the right side of the page another?

Your house painting analogy is not really the best -- because the painter will not be asked to move a wall (and if they are, they will have the skills to frame, sheetrock, tape and prep before painting). Whereas, a site designer may need to move a wall (table, css) and various structural stuff...

For example: if you are "only" designing the look, you may have to deal with the header. Or the footer, or a variety of other templates, hence WEBMASTER MODE!

My suggestion to flow-chart the entire structure of x-cart was only if you wanted to get your head around it quickly. Otherwise, you can treat xcart on a "need-to-know
basis -- and dig for the answers as needed... webmaster mode (as customer) is your best friend.

YOU do not need to learn every in and out. BUT -- know your basic page structure and how a page is constucted -- but in xcart, since templates (and tables) are nested, it's sometimes a 4D cluster-f*#k

I have to go through "page by page" and determine what elements are on that page, and what images etc. are linked to that page, and what CSS has been applied.

Yes.

Basically it's like downloading a site somone else built and figuring out every element of how they built it.

Yes! Except you're not flying solo here -- you have webmaster mode guiding you. Webmaster mode will tell you what templates are involved... use a good ftp client/text editor combo and you will find most edits only take a few minutes.

Use your wysisyg editor to play with color, tables, etc... BUT don't rely on it for layout.

AND you have the resources of the community... I learn something new every day here... don't be shy!

Jeremy

[nabeelaejaz]

Originally Posted by balinor

Title is .VertMenuTitle

Footer depends on how you have it set....probably .bottom

Thank you so much alas it worked! Thanks a ton.

[nabeelaejaz]

Originally Posted by carpeperdiem

the way you can figure this out on your own is WEBMASTER MODE, and a little understanding of html/smarty -- but you don't have to "know" smarty -- just learn how to read and identify elements.

in WEBMASTER MODE -- you will discover which templates are responsible for the menu boxes. Then you'll clearly see that all of these "menu" boxes all call on a template called menu.tpl -- so look in menu.tpl and you'll see the $menu_title has the class, .VertMenuTitle

This is x-cart 101. May I suggest you grasp the skills needed to identify a css class or else you're going to be frustrated with x-cart.

If you are not using an FTP client that has a linked or integrated text editor, you probably should get one ASAP. You will be miserable without this tool.

Goog luck.

Yes you are right, I am getting a grasp of it, it was my first day with X-Cart, it is also the first time that I had experienced "Webmaster Mode" and its like wow. Thank you for the pointer, I am definitely looking out for it now. Thank you so much.

[paula]

Jeremy: once again, thank you for your reply!

Okay, what I want to do is change the colors of the default template. I don't want to change layout in any way. Can you help me understand why I would need to use external tools (such as GoLive or Transmit, etc.)? What do they do that I can't do within X-Cart? Find and Replace? makes sense to me. What else?