Summer Sale | Flat 10% OFF on All Themes Package. Use Coupon Code Summer24 | Limited Time Offer! Buy Now

WordPress Website Templates

Find Professional WordPress themes Easy and Simple to Setup

inner banner

Image right alignment with column text

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #10968
    Bakari
    Participant

    Can someone please give me the code for aligning an image in the right column of a Charity Theme front page section?

    Here’s a screen shot that shows what I’m referring to.

    I tried this code, but it puts the image below the text instead of the right side.

    </div>
    [/column_content][column_content type=”one_half_last”] [Column_content]

    #10970
    Grace Themes
    Member

    Hi Bakari,

    Use this below shortcode content in Section 2 for to display image in right side

    [column_content type="one_half"]
    <div class="best-featurs"><i class="fas fa-dollar-sign"></i>
    <h4>DONATE MONEY</h4>Proin nec gravida purus. Curabitur effici elementum dolor dapibus, nec maximus augue iaculis. In tincunt eget diam ac vulputate... 
    </div>
    <div class="best-featurs"><i class="far fa-heart"></i>
    <h4>BECOME VOLUNTEER</h4>Proin nec gravida purus. Curabitur effici elementum dolor dapibus, nec maximus augue iaculis. In tincunt eget diam ac vulputate... 
    </div>
    <div class="best-featurs"><i class="fas fa-location-arrow"></i>
    <h4>SPONSORSHIP</h4>Proin nec gravida purus. Curabitur effici elementum dolor dapibus, nec maximus augue iaculis. In tincunt eget diam ac vulputate... 
    </div>
    [/column_content][column_content type="one_half_last"]<img src="http://yoursite.com/wp-content/themes/charity-help/images/slides/slider1.jpg" />[/column_content]

    Please check the documentation
    https://gracethemes.com/documentation/charity-help-doc/#how-to-help

    Regards
    Grace Themes

    #10985
    Bakari
    Participant

    Awesome, thanks for that code. It definitely aligns the picture to the right, but I don’t want the icons on the left for each bullet item. When I tried removing those code snippets for the icons, it ended up putting the picture back at the bottom of the text. Can you give me the code without the icons code?

    Sorry I don’t know enough about CSS to figure it out myself. I didn’t realize when I bought this theme that I would have know the coding. But it’s good to know where the sample coding is for us.

    #10986
    Bakari
    Participant

    Also, without the icons, is there a way so that the bullet text don’t come up the edge of the page? How can I get them to move over using css code?

    Here’s what I’m referring to:
    https://cl.ly/c0649a35909b

    Here’s the webpage where the section is located: https://dignityinschools-ca.org

    #10992
    Grace Themes
    Member

    Hi

    If you don’t want to use small icons, just remove the code: <i class="fas fa-dollar-sign"></i>

    So modified code is

    [column_content type="one_half"]
    <div class="best-featurs">
    <h4>DONATE MONEY</h4>Proin nec gravida purus. Curabitur effici elementum dolor dapibus, nec maximus augue iaculis. In tincunt eget diam ac vulputate... 
    </div>
    <div class="best-featurs">
    <h4>BECOME VOLUNTEER</h4>Proin nec gravida purus. Curabitur effici elementum dolor dapibus, nec maximus augue iaculis. In tincunt eget diam ac vulputate... 
    </div>
    <div class="best-featurs">
    <h4>SPONSORSHIP</h4>Proin nec gravida purus. Curabitur effici elementum dolor dapibus, nec maximus augue iaculis. In tincunt eget diam ac vulputate... 
    </div>
    [/column_content][column_content type="one_half_last"]<img src="http://yoursite.com/wp-content/themes/charity-help/images/slides/slider1.jpg" />[/column_content]

    Regards
    Grace Themes

    #11001
    Bakari
    Participant

    Thank you, appreciate it.

    #11006
    Grace Themes
    Member

    You are most welcome..!

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.