Jump to content

Archived

This topic is now archived and is closed to further replies.

BentleyD

Customizing the Flipper

Recommended Posts

BentleyD+    2
BentleyD

Hey Guys,

 

I am working on http://BuMarketing.com

 

I would like to customize the flipper at the footer of my page. Right now it is only displaying one post per flipper section. I would like it to display 2 per flipper section and the thumbnails to be smaller. How can I achieve this?

Share this post


Link to post
Share on other sites
James B    436
James B

Hi Bentley

 

To get two posts to show in the flipper panel you can select the figure in the sections options via the dropdown - http://screencast.com/t/cOYaAILrS

 

Do you want to change the width/size of just the image? Or the text as well. To change both you'd could try something like the below

 

.flipper-wrap .flipper-items > li {
    width: 200px !important;
}
 
To change just the image you could try the below, but you'd have to adjust the margins to move closer together if you made the % value too small etc.
 
.flipper-wrap .flipper-items > li img {
    width: 50%;
}

Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
BentleyD+    2
BentleyD

Hey James B,

 

Thank you for responding. That worked visually, but for some reason it's kind of glitching now when I click the arrow to see more posts?

Share this post


Link to post
Share on other sites
James B    436
James B

Ok so you want it to look like this visually, 2 by 2 by 2? http://screencast.com/t/Rj3pIxjar8J

 

In that case remove the css I gave you previously, add a 3 column section from the drag and drop into the layout and then drop a flipper unit in each column. Set the option for each flipper unit to display max of 2 posts


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
BentleyD+    2
BentleyD

James B Wait.. That's literally exactly what I had set up before I used the css code you gave me? If I remove the code then its just one post per column like it was before. I would like to display 2 posts per column like your screen shot and what I currently have on the site with the code active. It's just glitching when I try to navigate to more posts. Whats going on? 

Share this post


Link to post
Share on other sites
BentleyD+    2
BentleyD

Does anyone know how to help me with this?

Share this post


Link to post
Share on other sites
James B    436
James B

Hi Bentley

 

To get that affect in the screenshot image I just changed the settings inside each of the flipper units to display 2 posts and placed on flipper unit in each of the three columns. I've made a screencast to show this - http://screencast.com/t/S9ndp9gySN2V


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
BentleyD+    2
BentleyD

I'm not sure what I am doing differently.. I do exactly what you have shown in that video and it's not reflecting the same changes? Here is a screen shot..

Share this post


Link to post
Share on other sites
James B    436
James B

Hi Bentley,

 

In the editor, see on the left hand side you have global and local settings, check in the local to see if you have the local set to only show 1, where the global is set to 2 etc. As the local will override the global settings.

 

If you still have no luck set up a user login and email hello at pagelines.com with the credentials and a link to this thread and one of us will log in and have a look.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
BentleyD+    2
BentleyD

Hey James B,

 

I emailed my credentials and you guys fixed it. I added one more section and column and the problem came back... What ended up being the solution?

Share this post


Link to post
Share on other sites
James B    436
James B

Hi Bentley, last time I just went in and reset/save them. However, I have since found out its displays based on the width of the site. So it calculates if it's wide enough to show two within that space and if it doesn't think it can display two so they're clearly visible it will show one.

 

So adding the extra column you'll need to make the site width wider to be able to display 2 rows in each of the 4 sections.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites

  • Similar Content

    • dreamsight
      By dreamsight+
      We only want the images and title mouse-over, not link/click to the actual post the title is from.
      Any ideas anyone?
      Thanks
    • yemoonyah
      By yemoonyah+
      I just installed and added the Flipper section to my home page and it makes my navigation/menu bar items disappear.
      They do show up again when scrolling down and everything seems normal on the other pages.
      http://yemoonyah.com
      Thanks.
       
    • king_kcm
      By king_kcm
      Is there any way to hide the excerpt in Flipper, and the navigation arrows?
    • nandorj78
      By nandorj78+
      How do I hide (or change) the category title in the Flipper section?
      Could there be a setting for this in the editor?
    • flourishdesignstudio
      By flourishdesignstudio
      Hi there! I'm trying to use flipper to show upcoming events on a site.
      I've installed and created some test events using The Events Calendar by Modern Tribe. I installed Flipper. And in Page Editor > Flipper > Edit, it recognized the Events post type.  It also recognized the event categories. So far, so good!
      However, on the front end, it shows the featured image (great!), the event title (great!), But... it shows the published date instead of the event date and no description excerpt.  See http://www.getreadyforwow.com/park/calendar-test
      When I try to use regular post types, it does not show and events or event categories, so I cannot use that as a backup option.
      Can you help me get the events to show correctly? I feel like I'm 75% there, but would like the date of the event (and not the post date) and the event description excerpt to show. I'm attaching a screenshot of what I am trying to accomplish. And you can see what is happening here (please ignore the test site styling!
      I truly appreciate your time and help!

×