trello increase card dimension to larger size

[Roux Laflame]

the cards are too small so how do I change the card size like what can easily be done in excel?

[Oday Rafeh]

Welcome, @Roux Laflame , 

Trello doesn't have a built-in option to resize cards. To change the card size, you can simply use your browser's zoom controls:

Press "Ctrl" + "+" to zoom in.
Press "Ctrl" + "-" to zoom out.

This will change the size of everything on the Trello board, including the cards.

[Jonathan Greenberg]

This is not a solution. Yes, this increases card size, but it also increases font size and the size of all page elements. I can't know for sure, but I think the question was asked with the intent of being able to view more content in a wider card.

I, too, wish there were a usable solution to this. I have addressed the issue with custom CSS, which meets my need but is not a lasting or robust solution. A powerup that provided some control over card width would be most helpful.

Regards,
Jonathan

[Geoff Infield]

This is TERRIBLE, please stop focusing on weirdly sorting labels by colour and let this be the productivity tool it was originally intended to be.

I'm a developer and use this to break down my Jiras and make notes etc that I don't want to share.

I didn't use it for a while and now EVERYTHING WE TYPE IS ONLY 512px WIDE?!

This is a real deal breaker and I cannot for the life of me see ANY logical reason for it 😥

[essent]

The post is from 2023.  Do you know if something has been done in this area in later versions or extensions?

Is there any "user voice"  so we can suggest ideas and votes for features in Atlassian products, including trello?

[Geoff Infield]

Dunno if this'll work in your Trello, but these classes seemed consistent - I gave up trying to defeat their 'width' and 'max-width' calculations and just updated these two DIVs which expands the important field types I guess.

F12 (Devtools) -> console -> paste the JQuery one at a time at the '>' prompt bottom of the list of messages, with whatever width allows it to be READABLE!  

$('.pXb5Fp1I47P0S2').css('width', '1280px !important');

$('.P2jfHL0ryA_fCy').css('grid-template-columns', '[main] 1280px [sidebar] minmax(0, 1fr)');

I can't believe they did this. It's unusable now, being a software dev I'm posting chunks of code and query results in their 'code' box which is a small subset of the 768px they allow the entire div to occupy of our WIDESCREEN MONITOR 😥

I'm finding another tool. The fiasco with them thinking sorting labels by colour without telling us was a warning.  I wish I'd listened then. 

[essent]

It really works! Thank you mate!
I'm not super familiar with Dev Tools. Is it possible to save it permamently, so when open it another time will get the same size?

[Geoff Infield]

Yay! I had to ask Grok, there are browser plugins to automate it but I can't install them here.

In Devtools apparently under 'Sources' the double right arrows at top left beside 'Page' hide a 'Snippets' feature I've never seen that allows adding javascript snippets which can run JQuery - this makes my life a LOT easier thanks!  

Source > Snippets > New snippet > Name it >Paste this  > Ctrl-S to save the it to file;

(function() {
   if (typeof jQuery == 'undefined') {
      var script = document.createElement('script');
      script.src='https://code.jquery.com/jquery-3.6.0.min.js';
      document.head.appendChild(script);
      script.onload = function() {
         runScript();
      };
   } else {
      runScript();
   }

   function runScript() {
      jQuery(document).ready(function($) {
         $('.pXb5Fp1I47P0S2').css('width', '1280px !important');
         $('.P2jfHL0ryA_fCy').css('grid-template-columns', '[main] 1280px [sidebar] minmax(0, 1fr)');
      });
   }
})();

Then go to it and right-click 'Run' it for every single card you open tho with devtools left open permanently it's not a biggie; 

If it doesn't do anything, it's probably cos devtools needs to have your tab's Sources > Page loaded and it doesn't handle change very well, it can be a pain to convince it to pick up another one sometimes (close the pages in Source > Page, refresh the browser tab, it's fickle) 

Grok's suggestion on using extension is sounding better by the second - configure it to run on "https://trello.com/c/*" (c for card I guess) not "https://trello.com/b/*" and it SHOULD be sorted 🤞

Using Browser Extensions (e.g., Tampermonkey or Violentmonkey)

• What it is: Browser extensions like Tampermonkey allow you to run custom JavaScript (including jQuery) automatically on specified web pages via userscripts.

• How to set it up:

  1. Install Tampermonkey (available for Chrome, Firefox, Edge, etc.).
  2. Create a new userscript in Tampermonkey.
  3. Use the @match or @include directive to specify the target web pages (e.g., https://trello.com/c/*).
  4. Write your jQuery script within the userscript, ensuring jQuery is loaded if the page doesn’t already include it.

Hope that helps!  Learning that snippets exist helped me! 🤗 

[essent]

Thanks a lot. I will test it when have more time.