I recently got hired as a web developer, and the project that I am overseeing has a formatting issue on one of the pages because one of the divs is out of whack. It is a fairly complex page with quite a bit of php, and from what I can gather, I am missing a </div> tag somewhere, and accordingly everything is messed up.
I am currently using notepad++, which is decent at lining up divs, meaning that if you click on the opening div tag, it will highlight purple and also highlight the closing one. But it seems as though if you have div tags that span several lines (hundreds) it won't work.
Has anyone else run into a similar situation? Is there a better editor I could be using that would do a better job of helping me with my div issue? Or do I have to go through and line up the divs 1 by 1? (there are like over 100). Please let me know!! Thanks
An alternate route I would like to suggest is running your page through a validator, such as the W3C service at http://validator.w3.org
HTML Validator is an addon for Firefox that can automatically run your pages through a local validator and notify you of any issues with an icon in the satus bar.
You want an editor that detects and highlights syntax errors in markup (as well as validity). There are many. I use Komodo Edit from ActiveState (www.activestate.com)
A cross platform solution is Eclipse (PDT). It comes with a nice and handy html editor. For quick file changes and hotfixes I use TextMate – but this is OS X only :(
Sometimes, when I have crazy X/HTML that I am trying to clean up/debug I put it into an XML editor and let it do some of the matching/formatting for me. My personal choice is Altova's XMLSpy. It is not free (hell, it's not even cheap), but I really like the power it has. You can download a free demo from their website and see if it helps you out.
Like what others have said, use a free editor like Eclipse. Open your HTML in Eclipse, then press CTRL+SHIFT+F and it will format and indent the code, just like what Notepad++ does.
Is this page already online in public area?
If yes, did you try to validate the HTML/XHTML with W3C validator http://validator.w3.org/, it might tell you the exact line where the closed DIV tag is missing.
UPDATE: you can also copy and paste code of the page deirectly into the validator and validate it: you go with your browser at the page, then you select "View Source" from the browser manu, than you copy & paste code into W3C validator.
You could try using a more "Powerful" editor such as Eclipse or Netbeans. I use Netbeans for most of my HTML / PHP development, and it does a good job of highlighting matching tags.
Vim + matchit plugin
I use http://users.rcn.com/creitzel/tidy.html#tidyui for fixing html.
Related
Selecting code snippet and hitting Tab button - one of the way to indent sections in the file.
In Emacs editor to achieve such a behaviour https://www.drupal.org/node/59868 these settings are done (keeping in mind Drupal CMS coding standards)
Was not able to achieve similar thing in Atom Editor https://atom.io/
Can anybody guide some way so that i can try doing this?
Thanks in advance!
Have you tried Auto complete plus? It seems to have a snippets sub-package.
My first place to look at this was a fix with Notepad++.
This quite quickly brought me to "TextFX HTML Tidy".
Read the description and it seemed to be the problem for all my problems.
However, the install is quite hard, apparently TextFX used to be standard practice for Notepad++, for some reason that is no longer the case. I eventually fixed this by downloading an older install for Notepad++ and copied the plugin folder to my own Notepad++ file.
This gave me acces to the correct plugin, but this plugin is written purely for HTML, C++, or XML.
Since I use php in my files, this gives some complications. Normal tags are ignored as they should be, but when I use php inside an html string, in a link for instance, the php tags get converted to html.
For instance:
The start of my sentence Here my anchor tekst.
After tidy HTML becomes
The start of my sentence Here my anchor tekst.
Rendering this solution unusable.
There must be a lot of people looking for this functionality, and since this one is no longer standard practice for Notepad++, I figured there must be a better method to auto format your HTML code. But for some reason I can't find it.
So my question is: Is there a way to autoformat my code, clearing empty lines and indenting tags in the correct opening and closing order?
Preferably with Notepad++ but any other program will do.
Kind regards
For anyone looking for the same things. Switching to Netbeans did the trick for me, options with Notepad++ are still appreciated.
In Netbeans, using Shift+alt+F did the trick for me.
I am in need of a live editing software for PHP like there is DreamVeawer for CSS. I need the functionality that I can select items from the webpage and it will highlight the particular source code for it. If anyone knows about such a software please let me know.
Thanks in advance.
Firefox has a nifty add-on called Web Developer. You can't edit the PHP code directly because it's server side but you can highlight/edit the resulting HTML. You can find it here https://addons.mozilla.org/en-US/firefox/addon/web-developer/
Use google chrome's webkit inspector, it will find you the right html source code, which you can then trace back to the PHP code.
I'm afraid you won't find a solution for that.
PHP runs on the server-side and doesn't render any code to the browser like HTML does.
The closest you'll come is selecting DOM elements in Firebug/Dreamweaver(or any other designy IDE) rendered after the PHP is parsed
Im not sure what youre looking for exactly. If you want a WYSIWYG html editor they are plenty.
If youre tring to trace function and method calls in code then you need an IDE with code assist. Both Eclipse and Netbeans with their respective PHP plugins have this - i.e. you click on a function call and it opens the file containing that function. Depending on the context this can also work with variables...
I think there are also WYSIWYG html plugins for both but im not sure as i dont use them.
This isn't exactly what you want but this IDE can give a help
Aptana http://www.aptana.com/
or
PHPStorm http://www.jetbrains.com/phpstorm/
I'm looking so long for a Dreamweaver extension to auto beautify PHP / JavaScript / jQuery code. Currently Dreamweaver can beautify only HTML and CSS (Apply Source Formatting).
Any kind of help will be much appreciated.
Online solutions for validation and formatting JavaScript:
Validate JavaScript code:
http://www.javascriptlint.com/
Format JavaScript code:
http://jsbeautifier.org/
For the PHP side of things use https://github.com/fabpot/PHP-CS-Fixer
This short excerpt and more information is taken from the README.
Installation:
Download the php-cs-fixer.phar file and store it somewhere on your
computer.
Usage:
The fix command tries to fix as much coding standards problems as
possible on a given file or directory:
php php-cs-fixer.phar fix /path/to/dir
php php-cs-fixer.phar fix /path/to/file
I have found this great dreamweaver extenstion, just give it a try
Their Homepage: http://www.decodize.com/projects/
extension download page: http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&loc=en_us&extid=2107536
You can use PhpEdit, it's an extra debugger!
DW doesn't do debug, you find the error if and only if you run your code.
With PhpEdit, it is onTime.
Maybe try http://www.javascriptlint.com/
says it works on some IDEs, maybe DW is one of them.
Try googling, but use 'code format' not 'beautify'
I was wondering if you could elaborate on how to set this up. I see the CSS and Tag Libraries options under "Advanced Formatting", but I am stuck at that point as to how to get my PHP to start auto-indenting.
Or, if Dreamweaver has somehow fixed this problem, let me know! It seems like every other IDE has an auto-indent feature! Thanks :)
It's been a while since I have used DW, I use Aptana now and there is an option to format the code from one of the drop down menus. Just use something like "control a" (To select all your code), "control f" (To format your code). There might be another key combination but I think this will work if memory serves.
Maybe "esc control f"
I've not seen anything for Dreamweaver, but if you can copy ans paste the code, http://jsbeautifier.org/ can help you with making code look a good bit better. I've just tried it on some packed JavaScript and it worked out very well. You can also download the application and run it locally (it's only HTML and JavaScript), so you won't need an internet connection to get your code prettier.
Best way i found is to set the way Dreamweaver displays code yourself. Sure it takes some time to do but its worth it.
Here is how:
Dreamweaver: Edit > Preferences > Code Format
Then under Advanced Formatting you can pick CSS... or Tag Libraries...
You can make any of your code look as it should this way.
Like i said, will take some time but do it once and you can keep using it with all your future Dreamweaver versions.
In Dreamweaver CS6 no need any other extension or tools.
Just select your code and then Go to 'Commands' > 'Apply Source Formatting' or 'Apply Source Formatting to Selection'
Done. :)
isnt there any software/plugin to netbeans/eclipse that auto indent the whole code after i've inserted it?
not just indent when i press ENTER for new function.
i want to paste in a code for example without indents and it will auto indent everything automatically since it can recognize what language is used.
should save a lot of time.
In Zend Studio (and I guess in Eclipse with PDT as well), you can right click your pasted document in the editor view and select Source Format. Rules for source formatting are edited in Windows Preferences PHP Code Style Formatter. You can select Code Conventions like PEAR or ZF there by default or invent your own.
If you just want to indent some selected lines of code back and forth you select it and hit tab (or shift tab to unindent). This will not resolve any nested code though. Use Ctrl Shift F for that (thanks to Paul Lammertsma for pointing that out).
In Eclipse you can press Ctrl+Shift+f to autoindent your open file.
In Netbeans go to the Source menu, choose the Format option. It does what you need. It will follow the formatting options you set from Tools menu, Options dialog.
Polystyle is a standalone tool that can be integrated into most IDEs, and does highly configurable source code formatting for many languages. It costs $15.
I believe the Eclipse shortcut to auto-indent the selected code is Ctrl+i, at least it is in Eclipse for Java, so I assume it would be the same for Eclipse PHP.