I'm trying to get Tumblr's photosets to appear 640px wide.
I'm modifying CATCHING ELEPHANT for my blog http://assemblyradio.tumblr.com/
I'm making the whole posts section of the theme wider.However, I can't seem to get photo sets to appear 640px wide.
I would like the sets to show up as Tumblr intended with their fancy layout, because they look great. Therefore this solution is not what I'm looking for:
Change default photoset size on tumblr
I have tried java script from here:
Tumblr theme dev: Square-75px photos for Photoset posts
and here:
Change default photoset size on tumblr
The second script sort of worked but the images are cropped off =(
If I add some custom CSS I can get the iframe to be 640px wide, but then the height does not adjust accordingly!
Everytime I think I figure it out on Chrome's web developer tool, I can't seem to get the code right in Tumblr's custome CSS. I thought using this selector gadget [How can I get the CSS Selector in Chrome?
could help me target exactly what CSS I should be editing (to see if that could help) but it can't tell me the path to the element, maybe because it's an iframe.
Does anyone know how to to get custom photoset width?
Or how to get an iframe height to adjust automatically?
Or how to find a complicated path to a class?
Any help would be much appreciated. I just want to see my cute kittens.
Thank you!
Tumblr's limitations had also been annoying me, so I wrote a jQuery plugin for a fully responsive Photoset layout that uses Tumblr's style. It also includes extra information (that can be toggled on/off) for EXIF and caption data on each photo.
https://github.com/PixelUnion/Extended-Tumblr-Photoset
Related
Content of google form is by default 640px wide - which is set in class ".freebirdFormviewerViewCenteredContent", I need to make this wider. I´m embeding it on website with iframe and I can´t find solution how to add "width" css to make it work. It´s possible?
You can't style an iframe with CSS, there are two ways to solve the problem though:
Use javascript to style it: take a look at this answer
Don't use an iframe: use this tutorial to style the whole form without using an iframe
What I did to change the width of the form was change the width within the embedded code within the iframe.
Apparently, there is no way to do that and I have looked everywhere. Currently, there isn't an option to make the Google Form wider.
Check out this link on google forum:
https://productforums.google.com/forum/#!topic/docs/FaGfvxnm51U
I am using the pro-theme "Frame" for Wordpress and have not been able to find support elsewhere for an issue (developer of theme won't support plugin compatibility issues--understandably). I am trying to re-position header/nav so that it does not overflow onto background images, rather, the background images are positioned below the header/nav wrapper/container. I've been trying to fix this issue for a few days now and cannot find a solution.
For example: below the link will show the BG image of a woman and I would like her head to not be cropped/covered. I also need whatever changes to be responsive and work with the additional features on the site (i.e. - homepage has a slideshow, etc.).
LINK
Thank you for any help--it is much appreciated!
Best regards,
The HTML of the page is a mess. I suggest to modify the background image of the woman itself (with whatever editor you want), just add a top margin to the image, let's say 80px white colour.
This is the easiest solution. If you provide me more details were this background is generated/paced I may be able to give you the CSS solution.
Developers made new checkout section on our website but the pages don't size to ipad or smart phone. There are checkout buttons and important elements on the pages that need to be seen by buyers, but they are being left off (pages cut off the right third of page) --
I've been researching briefly for a quick answer -- the rest of our site uses tables and this section uses css and divs only -- is that why it doesn't do it automatically? I'm not talking about media queries -- just the full page resizing to the screen width automatically...
I don't want to use scrollbars but even that solution at this point would give a visitor the ability to actually checkout on these pages...
Can anyone help? It would be greatly appreciated.. If it is more complex, that's fine, but I suspect something can be done to make the pages fit (and zoom if need be) or (gasp) scroll..fairly easily.
Thank you in advance for your help!
Ok, that section does not allow scrolling because is disabled from the css stylesheet.
You can get back the scrolling by editing the css. Look in the css file for the styles of .section. It will have a overflow: hidden; property. (it seem that is stored on file screen.css, line 435)
Replace it with overflow: auto;
You'll then be able to do horizontal scroll. But in the end, that is not a real solution. Since it seems you are not a coder, you need to get someone to recreate the styles of your website in order to make it actually responsive.
I recommend you to use on your website bootstrap, which can be used to create a responsive navigation.
I have a client that is looking for a Wordpress plugin or theme that will display an image over a rotating slider, similar to the home page here: https://www.threebakers.com/
Any thoughts on an out-of-the box solution, or do I need to build this one by hand?
Ironically, I did this exact thing on this site here:
http://www.gilbertmeatlocker.com
Its using the popular Flex Slider, but its not Wordpress. I was working with Drupal on that particular site, so its a custom implement of the stand-alone javascript Flex Slider.
I had to fiddle around with z-index and I used negative-margins to move elements into position.
That particular implementation on gilbertmeatlocker.com is extra complex because the silver frame around the edge is also overlapping the Flex Slider. I would recommend not doing a frame like this if possible, though. It added some serious bugs that were difficult to make work on all browsers.
Putting a single image over the slider like your bakery example or the gilbertmeatlocker.com logo shouldn't be a problem though.
If noone else recommends something better, you could try Flex Slider. There is a Wordpress version of it.
Currently, I am implementing a scrollbar using a custom embedded image using my CSS stylesheet. This is a very simple, thin scrollbar. I would like to configure this scrollbar using CSS properties at runtime, but so far I have been unable to do so.
I know it can be done because I've seen examples of it in the net, but no code to review. Anyone have any suggestions?
Thanks!
This blog has an example that you can view the source of with a right click:
http://www.axelscript.com/2008/02/20/custom-scroll-bar-using-css/
This one has a few links that redirect to examples with image skins:
http://www.foxarc.com/blog/article/101.htm
You can see a lot of the css stuff for scrollbars and pretty much everything else here:
http://examples.adobe.com/flex3/consulting/styleexplorer/Flex3StyleExplorer.html#