How modify the short string box and make it bigger?

Don't miss out Virtual Happy Hour this Friday (April 26).

Try our conversational search powered by Generative AI!

AI OnAI Off

Home / Forums / Developers (Main Products) Forum / CMS 7.5 - 11 /

How modify the short string box and make it bigger?

Fredrik von Werder

Vote:

Is there a way to make the short string textbox any larger? It is so short now

Looked into EditorDescriptor but can't find a way to do it...

public override void ModifyMetadata(
			   ExtendedMetadata metadata,
			   IEnumerable attributes)
			{
				base.ModifyMetadata(metadata, attributes);
				
                          // CODE?
			}

Any ideas?

#114405

Dec 11, 2014 12:32

Henrik Fransas

Vote:

If you want it to be multiline, just add:
[UIHint(EPiServer.Web.UIHint.Textarea)]

But you might just want a little more width?

#114406

Dec 11, 2014 13:24

Fredrik von Werder

Vote:

No not textarea, just more width please ... :-)

#114407

Dec 11, 2014 13:32

Vote:

Does this apply to all text boxers or just some specific ones?

If all: There is some examples in Alloy Templates on how to implement your custom css-files.

With that you should be able to change the styling of the text boxes. Use firebug or similar to see if you can find a good selector

#114410

Dec 11, 2014 14:43

Fredrik von Werder

Vote:

All text boxes, yes

ok thanks, I'll have a look at the alloy package

#114412

Dec 11, 2014 14:53

Fredrik von Werder

Vote:

hmm no I can't find anything about this...

#114413

Dec 11, 2014 15:06

Vote:

Check out this article, under the heading "Adding a backgroud device image" you can see how to add css files.

http://world.episerver.com/blogs/Stefan-Torstensson/Dates/2012/12/Adding-a-new-device-to-the-view-resolution-drop-down/

However what the content for the .css file you can find by using the developer tools in your browser

#114415

Dec 11, 2014 15:21

Fredrik von Werder

Vote:

Tanks Alf!

Since I already had a Styles.css in my /ClientResources/Styles, i just added the corresponding classes from dojo there!

If you don't have it there, just must add it, and insert this into the module.config

<clientResources>
      <add name="epi-cms.widgets.base" path="Styles/Styles.css" resourceType="Style"/>
    </clientResources>

For the textbox fix, I just added:

input.dijitInputInner { width: 500px !important; }
div.dijitTextBox { width: 500px !important; }

Just change the width as you prefer

Fredrik

#114441

Dec 11, 2014 15:50

This topic was created over six months ago and has been resolved. If you have a similar question, please create a new topic and refer to this one.