Firebug - What the Heck Am I Looking At?

So I love Firebug - but how in the heck am I supposed to know what file to edit in Zen Cart?!

Does Firebug show you the address of the file you need to edit?

Example:
includes/templates/YOUR_TEMPLATE/theme150/stylesheet_tm.css

:shocking:

When you inspect an element, a section will open on the right side showing the css code for that element. Also, on the very right and aligned with the call (body, head, etc) is a link to the css. Clicking that link will open the stylesheet AND hovering over it will bring up a tool tip with the complete URL for the stylesheet.

The issue though is that I need to edit .html files and .php files which do not show up in firebug. I've used a search program which can not find the files. I've used the developer's tool kit which can not find the files. I've tried every last web search to find files that don't exist.

Quite frankly, I am going to need a lot of alcohol if my Zen Experience will be like this.

I am totally not feeling the Zen. I am feeling stress.

~Indi

Remember that the html you see is generated by the underlying PHP. If you are looking for text, it may have been inserted by a variable that is set in a totally different file.

You seem to be finding the right tools but are having trouble using them.

You'd be better served if you asked more-specific questions ... that may get more pertinent results.

uruharacosplay:

I've tried every last web search to find files that don't exist.

Unlike this response, I'm sure you didn't mean this to be funny, but exactly where do you expect to find files THAT DON'T EXIST?

Perhaps you should change tactics and look for files that DO exist instead? :smile:

Cheers
Rod

The HTML page you see is the output sent by a series of PHP scripts in many different files. One PHP file might assemble the header part of the page, another might be for the navigation part, several others deal with the main content, and another does the footer. However there are many more that don't directly send anything to the browser, they instead access the database or manipulate data in various ways.

So, once you know where on the page the problem is, this is a pointer to which files might be responsible. It can take a while to find where things are sometimes. When you search the PHP files, you usually need to search for hard-coded text not variable data, as the latter is inserted by the script and is not visible as code in those files.

You are better off copying the files to your PC via FTP before changing anything - and keep regular backup copies of everything.

If you use FireBug's HTML tab and expand the content, when you hover over an item (like div id="navSuppWrapper) its content on the page will blue. If that's the section you're interested in, you can go to your admin's Tools->Developer's Toolkit and search for navSuppWrapper in all files catalog/admin. That will let you know which files (PHP and CSS if you're running 1.3.9x) that 'tag' is present in.

lat9:

If you use FireBug's HTML tab and expand the content, when you hover over an item (like div id="navSuppWrapper) its content on the page will blue. If that's the section you're interested in, you can go to your admin's Tools->Developer's Toolkit and search for navSuppWrapper in all files catalog/admin. That will let you know which files (PHP and CSS if you're running 1.3.9x) that 'tag' is present in.

Thank you - that is truly the most helpful advice I have received so far on this issue.

Here is the file I am trying to locate:
>>View Attachment<<

Sorry, that image is too small (even squinting) to see ... are you running on a server or localhost? If you're on a server, having your site's address (and the page/area in question) would be a big help.

Try clicking the link instead of the attachment - I included a Google Doc link.

I use http://www.hostingduo.com
My web address is http://www.akihabaracosplay.com
I use Firbug and Developer's Tool Kit
When I view my site, I hit the search bar just below the CSS drop down menu and hit "Inspect Element" because I want to change the graphic as well as input some Japanese characters there. When I inspect the element, this is the code that I get:

View My Image

link doesn't work even after logging into Google

View the Mysteriooooous Cooooode

You've got a tough hill to climb with that template.

But.., This is telling you that the image is located in the includes/templates/theme150/buttons/english folder and is called search.gif. The includes directory is in the root of your site.

If you are wanting to replace this image, just replace it through ftp

Not wanting to edit the image (I did the ftp route :) ), I need to insert a graphic BEFORE the search form that says: "Enter Character Name Here --> "

So I don't need the graphic location - I actually need the file location to insert html text and graphics.

Love,
Indi

As stated earlier, the file that generates this is a php file using variables that are set in another, different file.

With your custom template (Template Monster, right?), there is no way to tell you which file is the right one. Sometimes they hard-code a value rather than touching the database.:no:

Your best bet is to use the Developers Tool Kit in the admin Tools menu to search for > search_in_descriptionand work from there.

I will definitely try that. Thank you so much. It's just so frustrating that I can't hard code my own store. :wacko:

Aw man. I definitely need help with the Tool Kit.

I sent you a pm with my info. Can you show me where the, "Search in description" option is, please? Thank you.

Actually, you will be searching FOR that term. In the Developers Tool Kit, the lower left block (Look-up in all files) is where you would enter search_in_description. In the next drop-down, select All Files - Catalog/Admin. Select the Case Sensitive box, then click on the search button.

You should have 11 or so instances of the term. Knowing which area of the cart your term is in will help you to weed out the non-applicable files. For instance, you are looking for something that places the term in a file versus one that defines the term.

Then (in this case) you'd look for something that is creating the field in a form. (This term is hidden in a form) This should take you to a tpl_ file.

This search results in 6 tpl_ possibilities but some can be ruled out. For instance, this search is not in a sidebox, so those two files are ruled out.

Through the process of elimination, you'll get to the right spot.

Don't expect to find button_search.gif anywhere in those files because the image is defined as the variable BUTTON_IMAGE_SEARCH in a completely different file.

All this COULD be slightly different from what I've given you here as your template is way different than standard. And, part of the reason it is so different is that they "hard-coded" many items. Sounds like what you're wanting to do, huh?

The whole point in database-driven, css-styled PHP is to avoid hard coding. Once button_search.gif is defined as BUTTON_IMAGE_SEARCH, we can place the variable in thousands of places. When it's time to change the image, we just overwrite the image in the proper images folder. Rather than having to go find where we hard-coded that image, all the images will change automatically.

Hang in there and AVOID shortcuts. Shortcuts are roads to disaster in programming and Zen Cart.

<soapbox>IMHO Template Monster's shortcuts around cart design too often turn into road blocks.</soapbox>

:hug::hug::hug::hug:

I take it we've had some success?
Glad #3,000 was helpful!
:clap: