Jump to:

5537 Posts in 1737 Topics by 1223 members

Customising the CMS

SilverStripe Forums » Customising the CMS » Easiest way to add images (with links) to the home page

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 1580 Views
  • Larry7
    Avatar
    Community Member
    21 Posts

    Easiest way to add images (with links) to the home page Link to this post

    I have been looking at the tutorials etc. and scanning the forums but the solutions seem a bit complex. What I want to do is add images on the LHS of the home page (well in the Main template if possible) and for the user to add the image and a link to another site.

    Doubtless there are many ways to do this but I would appreciate some guidance for the least complex way to achieve this. I am a SS neophyte so if it can be down without adding tons of modules etc. that would be great. I did mange to intall the CMS(!) and add the Blog module with some widgets so I am not totally new but so far have managed to keep my editing of the PHP or SS files to a minimum.

    Thanks

    Larry

  • craesh
    Avatar
    Community Member
    25 Posts

    Re: Easiest way to add images (with links) to the home page Link to this post

    Hi Larry!

    That's easy. First, you'll need to create a new class based on DataObject with your two fields: Image and URL

    <?php

    class MyLinkedImage extends DataObject {
       public static $db = array(
          "URL" => "Text"
       );
       
       public static $has_one = array(   
          "Image" => "Image",
          "Homepage" => "HomePage"
       );
       
       public function getCMSFields_forPopup() {
          return parent::getCMSFields();
       }
    }

    ?>

    Rename the class MyLinkedImage to anything you like and name the file the same way. Now download ImageDataObjectManager (you will find the module DataObjectManager on silverstripe.org) and install it. It will help you to manage your DataObjects. Now tell your (maybe newly created) HomePage.php to "have many" of these images:

    <?php

    class HomePage extends Page {
       // ...
       
       public static $has_many = array(   
          "Image" => "MyLinkedImage"
       );
       
       public function getCMSFields() {
          $f = parent::getCMSFields();
          $f->addFieldToTab("Root.Content.Image", new ImageDataObjectManager(
                $this,
                'Image',
                'Image',
                'Image',
                array(
                   'URL' => 'URL'
                ),
                'getCMSFields_forPopup'
             )
          );
          return $f;
       }
       
       // ...
    }

    ?>

    Here you'll find the docs for DataObjectManager

    Later, you display them by just adding this to your template:

    <% control MyLinkedImage %>
    <a href="$URL">$Image</a>
    <% end_control %>

    This will display all images at once. If you want to display on a a time randomly, you will need to add some logic - but that should be easy ;)

    Greetings!
    craesh

  • Larry7
    Avatar
    Community Member
    21 Posts

    Re: Easiest way to add images (with links) to the home page Link to this post

    Thanks. That doesn't look too complicated so I will give it a try.

    Another thought I had which didn't involve loading any modules was just editing the ss file for the main page but I can't find where it is on the web site! I thought I could just do the image editing outside of the CMS by changing the templates so that they pointed to the image files I want and perhaps have a modified main page template but it seems to be well hidden.

    Larry

  • craesh
    Avatar
    Community Member
    25 Posts

    Re: Easiest way to add images (with links) to the home page Link to this post

    Hi Larry,

    the templates are located in "themes/<your-theme>/templates". Just take a look at the documentation at http://doc.silverstripe.org/themes:developing.

    If you have specific questions about themes and templates, please open a new thread for each independent question. That way you will help later users to find your questions quickly.

    Greetings!
    craesh

  • m3d
    Avatar
    Community Member
    8 Posts

    Re: Easiest way to add images (with links) to the home page Link to this post

    and where do I upload the images to? a special folder?

  • Larry7
    Avatar
    Community Member
    21 Posts

    Re: Easiest way to add images (with links) to the home page Link to this post

    Thanks.

    I found where the templates were kept before I saw your post but thanks anyway. I then edited the homepage.ss and added CSS and HTML to the page to display the images I wanted. I also created some different templates so that other pages didn't have those images. And while I was there (and slighly OT for this this thread) added code for Google Analytics. So up till now I have been able to stay away from extending the CMS.

    1580 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.