Need Help with CSS
 

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

Re: Need Help with CSS
 

Title is .VertMenuTitle

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

Re: Need Help with CSS
 

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.

Re: Need Help with CSS
 

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!

Re: Need Help with CSS
 

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

Re: Need Help with CSS
 

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 -

Re: Need Help with CSS
 

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.

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

Yes.
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

Re: Need Help with CSS
 

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

Re: Need Help with CSS
 

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. :)

Re: Need Help with CSS
 

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?

Re: Need Help with CSS
 

Because how else are you going to edit the files? Using the built-in editor? Ugh...
Very small input box.
Doesn't work on some platform/broswer combinations (especially mac).
Because using a ftp client and text editor is a good practice.
Because you can undo an edit to the text editor.
Because you have a better visual representation of the code (line numbers, line breaks, color coding for code type, etc).
Because application switching is fast and easy (and fun).
Yes, find and replace -- and of course grep.

And my # 1 reason: because it's the right way to do it. :-)

Re: Need Help with CSS
 

Okay, separately from the tools needed to do the editing - I'm still completely confused. When I go into admin > edit templates I get a page that says "browse templates". Then there's the list at the top with skin1.css and buttons and today's news and a couple of others, and below there's a window with 2 columns full of folders. Are these 2 different groupings of the same templates? How many total templates are there? How many do I have to edit to accomplish my objective? Is there a flowchart anywhere that I can access that tells me how many "pages" theoretically are in the default site?

Am I reacting in an unusual way? Are there people who know exactly what to do and just sail in and make changes? Am I especially dense? I can't seem to get my bearings. There appears to be assumptions operative about what people should know coming into this thing and I clearly don't know things that are apparently obvious to others. What basics am I missing?

Here's what I know how to do: I could download an "unknown" html website into GoLive. In there I could open individual pages, and/or templates, and/or components. I could open the CSS File. Within all of those I could find where colors have been applied and change those colors. I could tell what's live text, what's a table cell and what's a graphic, and would know that if it's a graphic I would have to make changes in Photoshop. If I didn't want to have to mess around with resizing columns or table cells, etc., I would replace one graphic with a different graphic of the exact same size. That's the perspective I'm bringing to this.

Can I do that with an X-cart site? I went to the link you posted earlier about things to do in GoLive to keep it from screwing up the coding, which seemed helpful. Could I download the X-Cart site, and use my in and out links window to find all the linked templates? Do I just need to obtain passwords and settings, etc. to be able to connect to the server and access the site?

Since the site is dynamic would it not "download" as a series of pages and folders? Would it just be a collection of folders full of these individual templates? Like downloading a 100 components or something?

I haven't ever used a different text editor so I don't think I'm properly grasping what you're talking about when you talk about using the ftp client and text editor. Are you simply using a different tool than GoLive to connect to the server and access the pages?

Thanks again for your input and advice.

Re: Need Help with CSS
 

The reason you DO NOT want to download the entire xcart directory to your local drive, and open templates in golive, is that 99% of it is useless from within golive, and at best golive won't destroy your code.

Download a ftp client - most come with a 30-day free trial -- and everyone should have one, especially anyone doing work in the digital domain --

You will work in real time on the files -- that is, every time you "save" it's as good as an upload.

You will view your text files, er, templates, as code. Scary for a golive user at first!!! I know -- but you really need to make go live go away.

Yes. A tool that will not ruin your code.

Try it!

Re: Need Help with CSS
 

Okay, the mists are slowly parting...

First, Let's say I download Transmit 3; do I need to get ftp settings to be able to access the X-cart site?

Second, when I ftp into a server now, what I see is a long "list" of individual pages, files, and directories that have individual pages, files, graphics, etc. in them. Their relationship would not necessarily be clear just by seeing them in an alphabetical listing. Is that what I will see using Transmit or similar tool? More or less what I see now in the admin? Or does Transmit have tools like GoLive (like the In and Out Links) that will help me know what is linked to what? Will there be individual pages as well as directories? Or am I still going to be confronted with this big list of .tpl's, with no apparent organizing prinicipal and I'm going to have to still try to figure out where the heck I can change the page color from yellow to white? There's about 72 files/folders in my browse templates window - mostly .tpls, a couple of .js files and css files. And some of them have more folders inside them with more .tpls.

Thanks, thanks, thanks

Re: Need Help with CSS
 

yes. of course. just as you woould need if golive were to access the site. same settings.
a file list is a file list -- some ftp clients make it better looking.
No. You will use Webmaster Mode to tell you what file contains your code. You will then navigate to the template, and edit it. Or find the class that needs to be edited, then go to the correct css file.

You are going to have to be prepared to view code as text, and understand the heirarchy of the templates in the filesystem. If you are not prepared to deal with this, then you should return xcart, and get your money back - or hire a pro.

It is NOT a graphical envoironment like dreamweaver or golive.

You're gonna have to learn to read/edit some code if you want to do anything more than import products manually.

No disrespect intended, but there are many, many more folders and files nested as you dig deeper... hundreds and hundreds...

Yes, there is a learning curve if the idea of editing code via a FTP client is new to you. If you're not accustomed to viewing/editing code, you are in for a longer learning curve than most.

You may want to read some tutorials on html, smarty, ftp, and basic techniques... it will help you get over the hump.

Re: Need Help with CSS
 

Thanks for all of your help.

Re: Need Help with CSS
 

http://rawpk.com/up/img/5579contact.gif

Kindly also tell, where can I change or remove this altogether. Thank you.

Re: Need Help with CSS
 

did you read anything that I posted?

you will use webmaster mode, determine which template the item is in, then edit the template.

In this case, you'll see a LANGUAGE variable, and you can hard code it, comment it out, or edit the language entry in the admin.

you can also search the forum -- this question has been asked at least 1000 times...

Re: Need Help with CSS
 

Hi Paula, if you plan on sticking around, please read this thread and post your X-Cart version in your signature. Thank you :)

http://forum.x-cart.com/showthread.php?t=23970

Re: Need Help with CSS
 

Thank you once again, I had been using Fire Fox and hence some difficulty with it, now i am using explorer so alls fine. Thank you.

Re: Need Help with CSS
 

A useful extension for Firefox is the Web Developer Extension.