Search Results for 'ipad'

[Reva]

Reva

#241034

Hi,

I have issues with most of my content alignment in differnt browsers with screen size … in IE, safari and firfox in 13 inch screen and in ipad.

Please help me asap

[Reva]

Reva

#241034

Hi,

I have issues with most of my content alignment in differnt browsers with screen size … in IE, safari and firfox in 13 inch screen and in ipad.

Please help me asap

[Robert]

Robert

#239611

Question on getting images to be responsive.

On my home page, where I’m using Pagebuilder. I have a SiteOrigin Hero widget with a background image. I have some text I place in the image and a button

see: *Login to see link

I am testing Blocks as well. And trying to mimic the page above. I created a test page with a single column row layout, inside which is a row layou with two horizontal columns. Inside the first horizontal column are two advanced heading blocks. Inside the second horizontal column is another advanced heading. I did this for spacing and I could not get the spacing to mach my SiteOrigin Hero. Maybe there is a better way as I can’t seem to control the spacing using blocks like I can with PageBuilder.

The problem is in both cases, PageBuilder and Blocks, the images don’t shrink when the page is made to an iPad or iPhone size. I read somewhere about doing something like “max-width:100%” for responsive images in css, but not sure how to do that in Blocks or PageBuilder. I had hoped it would not take custom css and would be automatic.

You still have login credentials and the test page is Test.

Oh, by the way, in an earlier post I had mentioned that the classic editor was going away in 2020. You said it wasn’t, but I found an article by wpbeginners, not sure if they are connected with WordPress or not that it was going away in 2022. Here is the link:

*Login to see link

I also uploaded a bit of the content.

[Robert]

Robert

#239611

Question on getting images to be responsive.

On my home page, where I’m using Pagebuilder. I have a SiteOrigin Hero widget with a background image. I have some text I place in the image and a button

see: *Login to see link

I am testing Blocks as well. And trying to mimic the page above. I created a test page with a single column row layout, inside which is a row layou with two horizontal columns. Inside the first horizontal column are two advanced heading blocks. Inside the second horizontal column is another advanced heading. I did this for spacing and I could not get the spacing to mach my SiteOrigin Hero. Maybe there is a better way as I can’t seem to control the spacing using blocks like I can with PageBuilder.

The problem is in both cases, PageBuilder and Blocks, the images don’t shrink when the page is made to an iPad or iPhone size. I read somewhere about doing something like “max-width:100%” for responsive images in css, but not sure how to do that in Blocks or PageBuilder. I had hoped it would not take custom css and would be automatic.

You still have login credentials and the test page is Test.

Oh, by the way, in an earlier post I had mentioned that the classic editor was going away in 2020. You said it wasn’t, but I found an article by wpbeginners, not sure if they are connected with WordPress or not that it was going away in 2022. Here is the link:

*Login to see link

I also uploaded a bit of the content.

[Rebecca]

Rebecca

#239585

The Blog Archives widget is disappearing from the sidebar of my client’s blog when the sidebar wraps to the bottom of the page in iPad portrait mode in Chrome and Firefox, and in iPad Pro portrait mode in Safari.

The dropdown displays fine on every other device that pushes the sidebar to the bottom of the page in portrait mode.

This is not happening on the demo site I imported, so I’m guessing there is some conflicting CSS.

Hoping you can help me identify the problem. I will provide screenshots and account access in a private reply.

• This topic was modified 6 years, 5 months ago by Rebecca.

[Rebecca]

Rebecca

#239585

The Blog Archives widget is disappearing from the sidebar of my client’s blog when the sidebar wraps to the bottom of the page in iPad portrait mode in Chrome and Firefox, and in iPad Pro portrait mode in Safari.

The dropdown displays fine on every other device that pushes the sidebar to the bottom of the page in portrait mode.

This is not happening on the demo site I imported, so I’m guessing there is some conflicting CSS.

Hoping you can help me identify the problem. I will provide screenshots and account access in a private reply.

• This topic was modified 6 years, 5 months ago by Rebecca.

[Robert]

Robert

#238961

This reply has been marked as private.

[Robert]

Robert

#238795

To try and answer your question of what happens when I try to insert a row block, here is what I do. First, I select the row layout from the navigation menu, so I think I am in the correct spot. When I try to add a row layout block inside an existing row layout with content, for example near the bottom of the row layout, I momentarily see a blue circle with a + symbol inside it. As soon as I move the cursor closer to the circle it turns black. When I hit the plus symbol and select “row layout” from the menu options, it adds the row below the existing row, not inside the existing row. I’ll try and send you login credentials soon.

But here is information on having bad margins when I review the text in “iPad” view. I was logged into my WP account on my iPad. I loaded up the “page” I’m working on and it was bonkers in the edit mode. I could not make sense of it at all. The image background was a small rectangle and text was running up and down, beyond the borders of the image, clear into other regions and some of the text was white on a white background. Very confusing. It looks nothing like my desktop when I shrink down the window to the size of an iPad.

Also I notice margins don’t seem to be correct. On the “page” I am editing I have two copies of what I want. So I have two major row layout blocks. The first is the correct version I want based on what Ben told me to do:
row
-> single column
->> title
->> paragraph (I added this)
->> row
->>> double column

Below that main row above, is a second row with two columns. The texts are similar, I just could not get row – double col moved inside a row – single col. So I added the stuff from scratch (no content at first) and was able to match Ben’s layout. It became the first row layout.

Once the rows and cols had content, no matter where I put my cursor, I could not find a place to insert a row inside another row. This is where I was having trouble: inserting a row or rather having it inserted inside a row. So I started from scratch. However, when I look at the preview and shrink down the images to be about the size of an iPhone or iPad the formatting is all messed up. The “second” row which has two columns seems to have its margins correct. A little bit of an indent on the left and a little bit of an indent on the right and the image following the text. But the first row, which has a single col >> title >> row >>> double col (as Ben suggested I do) has margin on the left, but no margin on the right and is even missing some words. You’ll probably need my login credentials to see that too.

I’ve uploaded some screenshots of what I mean:

This is the first row layout block with bad margins, but Ben’s layout. It is the upper portion of text.

Here is a lower portion of text from the first row layout block. See how the image is not centered and text is missing from right edge.

Here is the second row layout block with the same text. However it is simply a two column row layout block.

Here is a little bit lower of that same block. The image seems to center nicely.

If I give you my login credentials, do I first hit the button “Set as private reply”?

[Martin]

Martin

#238542

Hiya,

I am trying to suppress the switching (or lower the point of change) from desktop menu to mobile hamburger menu on a landscape iPad in Ascend. The following code was great for virtue. Is there an equivalent to this for ascend?

@media (min-width: 768px) {
.mobile-nav-trigger-id {
display: none;
}
#nav-main ul.sf-menu, #nav-main-sticky-wrapper {
display: block;
height: auto !important;
}
}

[Martin]

Martin

#238542

Hiya,

I am trying to suppress the switching (or lower the point of change) from desktop menu to mobile hamburger menu on a landscape iPad in Ascend. The following code was great for virtue. Is there an equivalent to this for ascend?

@media (min-width: 768px) {
.mobile-nav-trigger-id {
display: none;
}
#nav-main ul.sf-menu, #nav-main-sticky-wrapper {
display: block;
height: auto !important;
}
}

[info794]

info794

#238056

Thanks Hannah, you are the best 🙂

I have only a last question.

I use this css to have shadow in sticky header:

.kad-header-menu-outer.headerclass, .container.mobile-header-container.kad-mobile-header-height  { box-shadow: 0px 0px 5px rgba(57, 63, 72, 0.3);
}

But on ipad devices i have the border also on left and right like this: http://prntscr.com/papiiv

How i can resolve?

Thanks and best regards

[Sharon]

Sharon

#233868

This is probably one of the most odd things showing up. I created a post including Kadence Slider Pro shortcode. Then a couple MailChimp recipients of this published post said they were getting duplicate images (one image may be there twice, then another 3 times; then some don’t even show up). One recipient forwarded me the email with the MailChimp post. I downloaded the images within Outlook to see the post there, and there were multiple duplicated images and others not showing.

Here’s the post on the website, which shows all images displayed correctly. *Login to see link

I therefore conclude that the duplicated images have something to do with MailChimp and the recipient’s mail program. It seems some of the odd things that happen like this occur with those who use an ipad or iphone, or any apple device. What do you think?

I wonder also if using Kadence Advanced Gallery (slideshow option) for all posts from now on would fix this??

[Sharon]

Sharon

#233868

This is probably one of the most odd things showing up. I created a post including Kadence Slider Pro shortcode. Then a couple MailChimp recipients of this published post said they were getting duplicate images (one image may be there twice, then another 3 times; then some don’t even show up). One recipient forwarded me the email with the MailChimp post. I downloaded the images within Outlook to see the post there, and there were multiple duplicated images and others not showing.

Here’s the post on the website, which shows all images displayed correctly. *Login to see link

I therefore conclude that the duplicated images have something to do with MailChimp and the recipient’s mail program. It seems some of the odd things that happen like this occur with those who use an ipad or iphone, or any apple device. What do you think?

I wonder also if using Kadence Advanced Gallery (slideshow option) for all posts from now on would fix this??

[John]

John

#231952

Hi there-

I’m development further project once again using Ascend Premium and Kadence Slider Pro.

So far, so good – but just a couple of issues (which I will post / ask about separately to avoid nested requests and potential confusion!)

First up:

Font SIZES on Kadence Slider Pro – when rendering on Mobile/Tablet devices?

My client has requested (fairly) small text on the sliders. Fine. – and working to spec. on Desktops.

However.. on mobile devices (iPad included here) the text seems to be being proportionately *scaled* (down) – so as such it is then far too small on mobiles. Hiding (captions) on mobile was easy – but not to the client’s liking (fair enough – they are needed really here).

I then briefly started overriding the CSS – but the placement of the slider text was then all over the place! (as feared/expected).

I had a look / search here but couldn’t find a prior post on this particular request/issue – so I hope I didn’t miss one (apologies if the case).

Is there a quick and easy way via some CSS to bump up the SIZE of slider text – but for mobiles and tablets only? (whilst crucially also preserving the placement / position of the captions (which is basically center/center (there are two text lines per “slider” at this stand..).

I suspect this one isn’t easily resolved(?) – but thought I’d ask! Thanks,
John

[John]

John

#231952

Hi there-

I’m development further project once again using Ascend Premium and Kadence Slider Pro.

So far, so good – but just a couple of issues (which I will post / ask about separately to avoid nested requests and potential confusion!)

First up:

Font SIZES on Kadence Slider Pro – when rendering on Mobile/Tablet devices?

My client has requested (fairly) small text on the sliders. Fine. – and working to spec. on Desktops.

However.. on mobile devices (iPad included here) the text seems to be being proportionately *scaled* (down) – so as such it is then far too small on mobiles. Hiding (captions) on mobile was easy – but not to the client’s liking (fair enough – they are needed really here).

I then briefly started overriding the CSS – but the placement of the slider text was then all over the place! (as feared/expected).

I had a look / search here but couldn’t find a prior post on this particular request/issue – so I hope I didn’t miss one (apologies if the case).

Is there a quick and easy way via some CSS to bump up the SIZE of slider text – but for mobiles and tablets only? (whilst crucially also preserving the placement / position of the captions (which is basically center/center (there are two text lines per “slider” at this stand..).

I suspect this one isn’t easily resolved(?) – but thought I’d ask! Thanks,
John

[mrtwanstall]

mrtwanstall

#231530

This reply has been marked as private.

[mrtwanstall]

mrtwanstall

#231394

I’m using site origin plugin to design my page. A row which consists of 3-5 columns with info boxes doesn’t seem to be responding well on smaller devices. It makes sense that when viewed on mobile (landscape or portrait) that these columns would convert into a single column. However when testing on ipad mini/ipad 4 in portrait mode it acts the same as if viewed on a mobile device even though the resolutions/screen size are much bigger. Presented as single column it doesn’t look very good as its too wide. It looks like it could easily fit 2 – 3 columns. I’m just wondering if this is how the theme is suppose to work and if there are any additional @media screen that could used here?

Thank you

[mrtwanstall]

mrtwanstall

#231394

I’m using site origin plugin to design my page. A row which consists of 3-5 columns with info boxes doesn’t seem to be responding well on smaller devices. It makes sense that when viewed on mobile (landscape or portrait) that these columns would convert into a single column. However when testing on ipad mini/ipad 4 in portrait mode it acts the same as if viewed on a mobile device even though the resolutions/screen size are much bigger. Presented as single column it doesn’t look very good as its too wide. It looks like it could easily fit 2 – 3 columns. I’m just wondering if this is how the theme is suppose to work and if there are any additional @media screen that could used here?

Thank you

[Ben Ritner]

Ben Ritner

#231143

I’m going to update and make it the same as ipad, fixed which will prevent any miss calculations.

Ben

[accounts]

accounts

#230885

Hi Guys,

3 things

—————
1) Custom Font aren’t showing on mobile – iPhone and iPad to be specific.

We’ve used the Kadence Custom Fonts plugin to add fonts from fonts.com – they’re successfully showing up in the typography drop-down and the H1, P etc are work fine BUT only on computer NOT tablet or mobile (iPhone & iPad only I think – a Samsung we tried was ok).

—————
2) Adding Fall back to a sans-serif

How to do you add the font fall back to a Custom Font?

Normally when you pick a standard font you end up with something like [Arial, Helvetica, sans-serif] so it fails neatly. Since adding the custom one which is “Avenir LT W01_45 Book1475508” there seems to be no way to set it to fail neatly (other than “Custom CSS” I suppose…?) So, now it has failed it is the basic serifed Times equivalent.

—————
3) Removing a Custom Font

I added 4 fonts via the “Add New Custom Font” interface and that was fine all 4 showed up in Typography BUT since then I’ve decided I wanted to removed 1 font ([Code Bold] to be specific) – but it is still showing up as an option in the Typography Drop-down. If I pick that option it seems to default back to the other [Code Regular] it seems.

—————

Thanks in advance for this!
Vanessa

[accounts]

accounts

#230885

Hi Guys,

3 things

—————
1) Custom Font aren’t showing on mobile – iPhone and iPad to be specific.

We’ve used the Kadence Custom Fonts plugin to add fonts from fonts.com – they’re successfully showing up in the typography drop-down and the H1, P etc are work fine BUT only on computer NOT tablet or mobile (iPhone & iPad only I think – a Samsung we tried was ok).

—————
2) Adding Fall back to a sans-serif

How to do you add the font fall back to a Custom Font?

Normally when you pick a standard font you end up with something like [Arial, Helvetica, sans-serif] so it fails neatly. Since adding the custom one which is “Avenir LT W01_45 Book1475508” there seems to be no way to set it to fail neatly (other than “Custom CSS” I suppose…?) So, now it has failed it is the basic serifed Times equivalent.

—————
3) Removing a Custom Font

I added 4 fonts via the “Add New Custom Font” interface and that was fine all 4 showed up in Typography BUT since then I’ve decided I wanted to removed 1 font ([Code Bold] to be specific) – but it is still showing up as an option in the Typography Drop-down. If I pick that option it seems to default back to the other [Code Regular] it seems.

—————

Thanks in advance for this!
Vanessa

[Chiara]

Chiara

#230813

GREAT!
Now the iPad shows backgrounds of the right sizes. It shows parallax effect when landscape oriented and fixed when portrait oriended, right?

Since you worked so hard on this component, maye you know also why in some mobile phones with android+chrome (mine is MI, attached is a test with a Samsung Galaxy S7) the parallax background is already y-translated when loading the page, causing that gap (different distance from different devices).

Thank you. I’ll check the new gallery block in the meantime.

[Chiara]

Chiara

#230610

Yes, I know… The point is I cannot release a website that does not work properly with Safari on iPads…

[Chiara]

Chiara

#230177

This is what happens with iPads.
From my mobile phone (Android with Chrome) I see scroll too.
The second photo is to show a delay in loading portions of the background when scrolling. However the image is clearly fixed.

[Chiara]

Chiara

#229997

Shortly, the iPads display the desktop rules. Any change has effect on them only if is applied through the desktp options, not the tablet or mobile ones.

[Hannah]

Hannah

#229994

Hey Chiara,
Have you made sure to clear your cache? Including your browser cache on your ipad?

Hannah

[Chiara]

Chiara

#229981

Hello, this is the link:
http://www.4zeroplast.eu/

I setted custom behaviour fot tablet and mobile view, but, while it works reducing the browser size on desktop, it does not on my iPad Pro and iPad Mini. They keep trying to load the parallax or fixed effect. I deleted the navigation data in both Safari’s settings.

[Chiara]

Chiara

#228662

Hello, using the Row layout, under the Background settings, if I set an image with the position option “fixed” or “parallax”, everything works fine except on iOS. From iPhone and iPad I see the backgrounds:

-oversized if setted as fixed;
-not covering the whole area if setted as parallax.

Any known issues about it?

Thank you.
Chiara

[Chiara]

Chiara

#228662

Hello, using the Row layout, under the Background settings, if I set an image with the position option “fixed” or “parallax”, everything works fine except on iOS. From iPhone and iPad I see the backgrounds:

-oversized if setted as fixed;
-not covering the whole area if setted as parallax.

Any known issues about it?

Thank you.
Chiara