locked
Setting permanent image size in content editor web-part RRS feed

  • Question

  • Hi,

    So, this is an awkward one really. I am using SharePoint 2010 Foundation, I have access to designer as well. We have an intranet home page with a variety of content, most of which is done using the content editor web part. I have been asked to look into setting an image-size so that it is fixed and cannot be changed by the user. Each content editor typically contains one image and some text, I need to find a way, if at all possible, to fix the image size to a certain size i.e 200px by 150px so that users cannot change it; this is more so that we can keep the images uniform sizes, as the users cannot be trusted to do this, we need to find a way of doing it.

    So, to confirm, a user needs to be able to edit the web part, put an image in and the image needs to fit to the size specified, no matter what image it is, without the user having any control over the size aspect after placing it on the web part.

    Another way I looked at doing this was to change the size in an image library to make sure the image is a certain size, but I also hit a dead end with this. 

    Any ideas, please let me know, I've read far too many help pages!


    Wednesday, January 7, 2015 1:43 PM

Answers

  • Rkingda,

    In my opinion, it is not possible to restrict image size in CEWP or so, unless you write your own. 

    If you change your approach to client side code where a single CEWP at bottom of the page will catch hold of all IMG tad and reset their Height and width to 200(irrespective of their original) then it might work without much hassle. You get the idea. :)

    How about below code

    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript">
    jQuery.noConflict();
    jQuery(document).ready(function($){
     
        $('img').each(function(){ 
            $(this).css("width",200);
            $(this).css("height",200);
        });
     
    });
    </script>

    But this CEWP must be present on that page or else add it in master page.

    Hope this will help



    Please 'propose as answer' if it helped you, also 'vote helpful' if you like this reply.


    • Edited by Sudip Misra Wednesday, January 7, 2015 4:25 PM
    • Marked as answer by Rebecca Tu Friday, January 16, 2015 9:08 AM
    Wednesday, January 7, 2015 4:24 PM

All replies

  • Rkingda,

    In my opinion, it is not possible to restrict image size in CEWP or so, unless you write your own. 

    If you change your approach to client side code where a single CEWP at bottom of the page will catch hold of all IMG tad and reset their Height and width to 200(irrespective of their original) then it might work without much hassle. You get the idea. :)

    How about below code

    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript">
    jQuery.noConflict();
    jQuery(document).ready(function($){
     
        $('img').each(function(){ 
            $(this).css("width",200);
            $(this).css("height",200);
        });
     
    });
    </script>

    But this CEWP must be present on that page or else add it in master page.

    Hope this will help



    Please 'propose as answer' if it helped you, also 'vote helpful' if you like this reply.


    • Edited by Sudip Misra Wednesday, January 7, 2015 4:25 PM
    • Marked as answer by Rebecca Tu Friday, January 16, 2015 9:08 AM
    Wednesday, January 7, 2015 4:24 PM
  • Hi,

    Set the height * Width of the image control using CSS as show below referring the element ID.

    <style type="text/css">
    #imageElementID
    {
      height : 150px !important;
      width :  200px !important;
    }
    </style>



    Thanks, Shakir | Please 'propose as answer' if it helped you, also 'vote helpful' if you like this reply.
    Wednesday, January 7, 2015 5:49 PM