- Web templates
- E-commerce Templates
- CMS & Blog Templates
- Facebook Templates
- Website Builders
WordPress Cherry 3.x. How to make text wrap the image on portfolio post pages
June 5, 2015
This tutorial shows how to make text wrap the image on portfolio post pages in WordPress templates.
WordPress. How to make text wrap the image on portfolio post pages
By default, the featured image and post text are positioned side by side and wrapped inside span elements that define the width of each of them:
In order to make text wrap the media content on portfolio post pages, you need to perform the following:
-
Copy the file loop-single-portfolio.php from the folder wordpress/wp-content/themes/CherryFramework/loop/ to wordpress/wp-content/themes/themeXXXX/loop/. If there is no loop/ folder inside themeXXXX/, you need to create one.
-
Open up the file wordpress/wp-content/themes/themeXXXX/loop/loop-single-portfolio.php and remove the following code:
-
lines 55, 126
<!-- BEGIN .entry-content --> <div class="entry-content <?php echo $right_block; ?>"> </div><!-- END .entry-content -->
-
lines 57, 124
<!-- BEGIN .entry-meta --> <div class="<?php echo $wrapper_blok_class; ?>"> </div>
-
lines 119, 125
<div class="<?php echo $content_blok_class; ?>"> </div>
Please check out the screenshots. The code that needs to be removed is highlighted:
-
-
Open up the file wordpress/wp-content/themes/themeXXXX/style.css and add the following code to the very bottom:
.portfolio p { display: block !important; text-align: justify; } div[data-motopress-loop-file="loop/loop-single-portfolio.php"] .span7 { margin-right: 20px; }
-
Save the changes in the style.css and loop-single-portfolio.php files and upload them to the server.
The result should look like this:
Feel free to check the detailed video tutorial below:
WordPress. How to make text wrap the image on portfolio post pages