I'm really quite new to Joomla and I've encountered a problem. On my homepage the article is showing just fine, but all the other modules (except for the menu bar) disappear when I switch to a smaller screen size. On my other pages the article doesn't even show anymore, just the menu bar. I'm using the purity III template. I have no idea what's going on since the settings in the layout of the template indicate that all modules that are showing on a desktop should also be displayed on a mobile device, and I've found no difference in settings in the articles itself. My site.
Thanks for your help!
It sounds like the responsive design hides them on purpose.
Just from a quick peek at your code using inspect element I can see that the class "slideshow hidden-xs" gets a display:none on smaller screen sizes and all of your main content is wrapped in that element. If all of your content is not supposed to be wrapped in that element (which I'm guessing it's not) you're most likely missing a closing tag on a div or something.
Find the missing closing tag (ie: /div, /a, etc) and it will probably solve your problem.
You can update the latest version of Joomla and check again that some problem is coming or not. I yes then download new theme for your website which is compatible with your theme.
Greeting and thanks for your generosity in providing this wonderful forum,
I'm using jQuery Orbit Slider and Reveal Modal. I setup the slider to include content and within the content are hotlinks to a series of modals.
I can't get the first modal, in the series of modals, to open. It appears the plugin is programmatically generating inline CSS that is overriding my CSS stylesheet. Mainly z-index selector is keeping the first modal hidden (or invisible). The subsequent modals in that series work as intended.
When viewed using Chrome Inspect Console shows the inconsistency please note at "featuredContent10" which is where the slide4 resides (it's actually a background image). The data-reveal-id="slide4-1" is the first one in the series of modals. I did not add the inline styles it's in the reveal.js file.
Unfortunately, I don't know enough about reveal and can't find any information regarding a solution. The information I came away with is to ask for assistance on stackoverflow.com. 99.9% of the time I find solution on my own, however, I'm at a lost and my client likes the features of both plugins. Any help you can give me would be very much appreciated.
If it helps here’s a link to the beta site: http://www.partnershipwithearth.com/thecooperationway-1/
Go to Slide 11 lower left link is the culprit. You'll notice the dialog box and close button do appear without the image (slide4-1).
Your expertise is greatly appreciated
I'm wondering how in PyroCMS I can add a custom field to a page. Ideally I would like to have an image area at the top of the layout, and have a custom field in pyro that would allow someone to populate that image from the pages module. I realize that there are some image plugins that allow me to attach images to pages, but I would like to be able to add the images directly into the page in the admin (as well as other custom fields for the pages). Even on a separate tab would be fine with me. I'm fine building something if someone can point me in the right direction.
Currently if you want to add a custom field to a page you have to hack the module. This is obviously not ideal and im not really suggesting it, but I had to do it for http://tedco.org/business to add a "Subtitle" field to each page.
2.2/develop is having its Pages and Blogs moved over to Streams, so you can add custom fields to all pages globally, meaning you can add an image in if you like, or append a US State for some reason, or add a slider. Whipee!
So right now: Hack it or wait. 2.2/develop will have your feature in a week or two.
I'm not sure you can do this directly from the pages module yet or not without some customization (possible hacking) though, I just asked and will update if possible.
In the meantime this might be helpful:
Consider looking into PyroStreams. for this though, it will require the Pro version of PyroCMS or you can purchase it from Parse19 directly.
You might find this article helpful about organization and page layouts.
Here is an article called Dynamic Pages with PyroCMS and PyroStreams though, it's a bit outdated now.
You may also make use of the gallery module, which is free though, I'm not sure this will meet your needs.
I'm working on a site in Joomla! and on the homepage, at the top of the article, it comes up with a h1 of the website name. The pagesource says (Note it's not the article title.)
Any idea how to get rid of it?
Thanks,
Steph
You can set this h1 tag not to display via the Parameters - System section of your Menu Item Manager screen in administrator ... this page has a nice depiction of the steps.
It's so simple
Just do the following :
Login to the Joomla Administrator Interface
Go to the Menu Manager
Select your Menu
Select your Menu Item (Home Menu)
On the right hand, Click Parameters (System)—> and in the *Show Page Title—->*Just Select No.
That's all.
This is not the desired solution, since many people, (including myself) actually need to be able to Set/Override the page title (That Appears in the Browser’s Title bar), and setting Page Title to no here will also remove the functionality to Configure the Browser title (which is important for SEO among other things).
Anyway, I have searched and not been able to find a fully correct solution via CMS or PHP Code. The closest solution which is not fully perfect, but unlikely to cause significant (if any) negative effect on your site is through Javascript (Example is JQuery).
jQuery(document).ready( function($) {
$(‘.componentheading’).empty();
});
This can also be done is JS with no JQuery. When I find a better method of doing this I’ll let you know.This should actually be done by removing output from a template file.I don’t know which one yet. When I do, I’ll post it…
When setting the page title not to show in the menu item as stated in other answers, this will not stop the text entered in the page title box being used as the browser title, it will just stop it being shown in the page.
Using javascript to remove it is not a good idea.
1. It will only work for browsers with javascript enabled
2. Search engine spiders will still see it. As the component heading for articles is 'articles' by default it will see all your pages with the same h1 tag.
Just turn it off in the menu item and enter your browser title in the text box above.
What Firefox add-ons do you use that are useful for programmers?
I guess it's silly to mention Firebug -- doubt any of us could live without it. Other than that I use the following (only listing dev-related):
Console2: next-generation error console
DOM inspector: as the title might indicate, allows you to browse the DOM
Edit Cookies: change cookies on the fly
Execute JS: ad-hoc Javascript execution
IE Tab: render a page in IE
Inspect This: brings the selected object into the DOM inspector
JSView: display linked javascript and CSS
LORI (Life of Request Info): shows how long it takes to render a page
Measure IT: a popup ruler.
URL Params: shows GET and POST variables
Web Developer: a myriad of tools for the web developer
Here are mine (developer centric):
FireBug - a myriad of productivity enhancing tools, includes javascript debugger, DOM inspector, allows you to edit the CSS/HTML on the fly which is highly valuable for troubleshooing layout and display problems.
Web Developer - again another great developer productivity tool. I mostly use it for quickly validating pages, disabling javascript (yes I disable javascript sometimes, don't you?), viewing cookies, etc.
Tamper Data - lets you tamper with http headers, form values, cookies, etc. prior to posting back to a page, or getting a page. Incredibly valuable for poking and prodding your pages, and seeing how your web app responds when used with slightly malicious intent.
JavaScript Debugger - has a few more features than javascript debugger provided by firebug. Although I must admit, I sparingly use this one since firebug has largely won me over.
Live HTTP Headers - invaluable for troubleshooting, use it frequently. Lets you spy on all HTTP headers communicated back and forth between client and server. It has helped me track down nefarious problems, especially when debugging issues when deploying your web app between environments.
Header Spy - nice addon for the geeky types, shows you the web server and platform a web site runs on in the status bar.
MeasureIt - I don't use this all too frequently, but I've still found it valuable from time to time.
ColorZilla - again, not something I use all that frequently, but when I need it, I need it. Valuable when you want to know a color and you don't want to dig through a CSS file, or open up a graphics editing app to get a color embedded in some image.
Add N Edit Cookies - this has been a great debugging tool in web farms where the load balancer writes a cookie, and uses the cookie value to keep your session "sticky". It allowed me to switch at will between servers to track down problems on specific machine. Also a good tool if you want to try to mess with a site that uses cookies to track your login status/account, and you want to see how your code responds to malformed or hacked info.
Yellowpipe Lynx Viewer Tool - yeah I know what your thinking, lynx, who needs it, its so 1994. But if you are developing a site that needs to take web accessibility into account (meaning accessible to users with visual impairments who use screen readers), or if you need to get a sense of how a web spider/indexer "sees" your site, this tool is invaluable. Granted, you could always just go out and grab Lynx for yourselfhere's the windows xp port that I use.
I've got a handful of other addons that I've used from time to time that I'll just quickly mention: FireFTP (one I installed wasn't stable and I've not tried a newer release), Html Validator (also found this one unstable, least back when I installed like a year ago), IE Tab (I usually just have both IE and FireFox open concurrently, but that is just me, I know many others that find this addon useful).
I'd also recommend the Web Developer extension by Chris Pederick.
As far as web development, especially for javascript, I find Firebug to be invaluable. Web developer toolbar is also very useful.
The ones I have are...
Y-SLow
Live Headers
Firebug
Dom Inspector
One that wasn't mentioned yet is this HTML Validator extension that I found very useful.
#Flávio Amieiro
MeasureIt is an unnecessary extension to have if you install the Web Developer Toolbar. Web Developer Toolbar includes a ruler as one of its features. Under the "Miscellaneous" category for Web Developer click the option "Display Ruler" to use a ruler identical to the MeasureIt one.
That will allow you reduce the number of extensions needed by at least one.
Firefox addons:
FireBug:helps web developers and designers test and inspect front-end code. It provides us with many useful features such as a console panel for logging information, a DOM inspector, detailed information about page elements, and much, much more.
Web Developer-gives you the power disable CSS, edit CSS on the fly, measure certain areas of a page and much more.
ColorZilla
Just click on the icon, hover over the area you'd like to know the hex color for, and click.
Window Resizer
to make sure the layout is displayed properly in the standard resolutions of today.
Total Validator
validating websites much easier by checking HTML, links, CSS and doing a lot more.
Web Developer for web development. Scribefire if you're a blogger-progammer
For web developing I use the Web Developer Toolbar, CSS Viewer and MeasureIt.
But I'm really not one of those who has a thousand of extensions to do everything. I like to keep things simple.
EDIT: Thanks to Dan's answer I don't need MeasureIt anymore. Can't believe I've never seen that! I guess I'll just have to pay more atention to this WebDeveloper toolbar.
Adding to everyones lists, Tamper Data is quite useful, lets you intercept requests and change the data in them.
It can be used to bypass javascript validation and check whether the server side is doing its thing.
I use Web Developer, it's a real time saver.
+1 for LORI ("life-of-request-info"). It's a very convenient alternative for rough measurements of the load time of a particular web page -- the kind of thing that you might otherwise use an external stopwatch for.
New Tab Homepage. Combined with a "speed dial"-type homepage (a personal, fast-loading page of links that you use frequently), helps you get where you're going faster when you open a new browser tab.
LastTab. Changes the behavior of Ctrl+Tab to let you navigate back and forth between your most-recently-used tabs with repeated presses of Ctrl+Tab, the same way that Alt+Tab works in Windows. Also provides a nice view of all open tabs while Ctrl is still being held down for easy navigation. (The resultant behavior is very similar to the Ctrl+Tab behavior in recent releases of Visual Studio.)
FireFTP is good for grabbing/uploading any necessary files.
I find Hackbar to be quite useful. Very useful if you want to edit the querystring part of the url, to test for vulnerabilities, or just general other types of testing where you might end up with complicated query string values.
I was learning DOM inspector, but I've switched to Firebug.
Some of which has been missed above are here
Load Time Analyzer – View detailed graphs of the loading time of web pages in firefox. The graphs display events like page requests, image loading times etc.
Poster – A must have tool for web developers enabling them to interact with web services and other web resources.
Aardvark – A cool extension for web developers and designers, allows them to view CSS attributes, id, class by highlighting page element individually.
Fiddler is a really great debugging proxy. Think of it as a more powerful version of the "Net" panel in Firebug or the Live HTTP headers.
It used to be an IE-only extension, now it also has hooks into Firefox.
Groundspeed, is useful for testing server side code. It was created for input validation tests during pentest, but can be useful for any test that require manipulating input (similar to TamperData).
It lets you control the form elements in the page, you can change their type and other attributes (size, lenght, javascript event handlers, etc). So for example you can change a hidden field or a select to a textbox and then enter any value to test the server response and stuff like that.