reset defaults to responsive design view
I have mistakenly removed presets in the "responsive design view" option found under "Web developer" option in menu. Is there a way to bring them back. I don't wan't to reset my firefox to factory settings.
Any help shall be appreciated.
Thanks
Chosen solution
Here's what I have and where to paste it. If you created your own sizes that you do not want to overwrite, you may need to copy those out and edit them into the array first before pasting.
(1) Select and copy:
[{"key":"320x480","width":320,"height":480},{"key":"360x640","width":360,"height":640},{"key":"768x1024","width":768,"height":1024},{"key":"800x480","name":"Android-WVGA","width":800,"height":480},{"key":"800x1280","width":800,"height":1280},{"key":"980x1280","width":980,"height":1280},{"key":"1280x600","width":1280,"height":600},{"key":"1920x900","width":1920,"height":900}]
(2) In a new tab, type or paste about:config in the address bar and press Enter. Click the button promising to be careful.
(3) In the filter box, type or paste preset and pause while the list is filtered
(4) Double-click the devtools.responsiveUI.presets preference and paste.
Skaityti atsakymą kartu su kontekstu 👍 14All Replies (14)
Resetting is the best way to restore what you lost.
Thanks for the quick response. Actually I dont wan't to reset the firefox browser because there are other settings that will be lost.
Not sure if the following will help: https://developer.mozilla.org/en-US/docs/Tools/Responsive_Design_View
Thanks for the link, the above link is telling about responsive design view which I already know. It would be appreciated if the makers of this feature would simply allow the user to add a new preset.
Note: There is an option of doing this though, but clicking that option simply allows the selected resolution to be renamed; one can not change the values of resolution.
Chosen Solution
Here's what I have and where to paste it. If you created your own sizes that you do not want to overwrite, you may need to copy those out and edit them into the array first before pasting.
(1) Select and copy:
[{"key":"320x480","width":320,"height":480},{"key":"360x640","width":360,"height":640},{"key":"768x1024","width":768,"height":1024},{"key":"800x480","name":"Android-WVGA","width":800,"height":480},{"key":"800x1280","width":800,"height":1280},{"key":"980x1280","width":980,"height":1280},{"key":"1280x600","width":1280,"height":600},{"key":"1920x900","width":1920,"height":900}]
(2) In a new tab, type or paste about:config in the address bar and press Enter. Click the button promising to be careful.
(3) In the filter box, type or paste preset and pause while the list is filtered
(4) Double-click the devtools.responsiveUI.presets preference and paste.
Actually, if you do not have any presets you've created that you want to save, you can simply zap that preference (right-click > Reset) to return to the defaults.
Thanks a lot. That helped.
AMAZING! I love Firefox.
What would make my life perfect, is if I can get a whole list of presets for all major devices in this formatted code, with their corresponding names.
Am I asking too much? Does anyone have this handy???
Much appreciated.
I don't think many people on the support forum are using Responsive Design View yet. If you search around on the web, can you find a critical mass of users somewhere?
No. This thread is all I could find. I think it's a nice tool but it's hard to specify dimensions if I want to add a preset. I have to keep adjusting the window. The method proposed is much easier. I was looking for additional presets that I can just download, or even a list of dimensions that I can format into this proposed code and voila. But no luck finding it.
There are so many devices and I'm a bit new to responsive design. So this helps a lot.
Hi jack_fu, yes, I think that drop-down menu needs a place to simply type the height and width instead of having to move pixel by pixel. Not sure if there is a wish list for this anywhere... Mozilla's decentralized method of working on wikis, bug databases, issue lists, blogs, etc., can make such things hard to track down.
javascript:(function(){ function rdObj(w,h,n){with(this){key=w+"x"+h;if(n)name=n;width=w;height=h;}} rdObj.prototype={key:"",name:"",width:"",height:""}; var n={},p='<width>x<height> <name>',rd=[]; while(p!=null){ p=prompt(p,JSON.stringify(rd)); if(/^(\d{3,4})[,x](\d{3,4})([, ](.+))?$/.test(p)){ n=new rdObj(RegExp.$1,RegExp.$2,RegExp.$4);rd.push(n); }else{try{rd=JSON.parse(p);}catch(e){}} }})()
Modified
huh??? what's the code for?
You can use the JavaScript code to create a list of dimensions like jscher2000 posted above, i.e. 800x600 gives this code:
- [{"key":"800x600","width":"800","height":"600"}]
You can use this as a bookmarklet or in the Web Console (Firefox/Tools > Web Developer;Ctrl+Shift+K).