Published layout errors

Hi.

As you can see the style “Body” has a *. Please hit “Apply Changes” for both devices.
Next, mark the red text completely (not only placing the cursor) from “North County … 8946”
Then redo the screenshots from above and show the result here.
This is indeed strange.

Mr. F.



So doing that finally got the text to at least sync. I went in and change some text to red to see and they synced. The text for links changed font size but I can change those individually since they sync across layouts. I assume that text and colors sync but formatting changes with the layout?

Ok, I just went to my site and out of 16 pages, 14 pages in one layout needs format or text changes, the 3 rd layout only needs 12! I’m going to do one layout until i can find an easier way to do things. This is like putting toothpaste back in he tube. Change text or margin or a box and in one format or the other it squirts out the top, or the bottom, or the side, or you just can’t even see it. Sometimes it even does it on its own!

Hi.

The screenshots look like I expected them to look.
If you want to colorize text, then I would create a new style for it. For example “boby_red”.

I wouldn’t do the 1220 and 960 layout by hand at the same time. Focus on 1200 and set 960 to either “auto” or “not available”. The only difference will be in the font size. You’re going from 27 to 22 anyway, which is about the same as auto scaling.

You save yourself a lot of work. Instead I would choose 768.

But that’s just my opinion. And maybe Greenskin’s.

Mr. F.

1 Like

Ok, so I took a 2 day break to look at the damage. I need to know a few things. I was told the changes were not being applied across the format because I hadn’t clicked the “apply changes” in the style box? If that is the case what does the "synchronization box in the layout section do? Also, if I make a change in the 1200 layout and then switch too a different layout and correct the highlighted changes does the synchronization then affect the1200 layout? I keep making changes in one layout and then changes I didn’t make occur in the previous layout. Font, text color, margins, text and color styles for links, they all seem to change at random depending on which layout I change. Also if the layouts are synchronized what does the style “apply changes” apply to? Both formats, one or the other, or across all the layouts?
And, if I make a change to anything in a layout, how do I see all the changes that will be made since I can’t see both layouts before it screws up the one I already fixed?

Sorry, I think you’re making this as harder on yourself as it should be

There are free and easier ways to embbed an calendar to your website, like a Google Calendar.

I’ve literally spent 2 minutes creating a calendar, getting an embed code and setting up on a Sparkle test. Now I would just need to populate the calendar via Google Agenda, and it would auto update, clickable and responsible, on the website.

If you’re having trouble setting this up, I can help you out. If you don’t want to use Google’s service, I’m sure there are others services around.

The way this calendar is set up, the user only needs to click on the event, then it will automatically pop their calendar app and add the information of the event on their own calendar, if they wish to.

Hope it helps!

Hi.

Most of your questions are answered in this Youtube Video
It is taken from an older version of sparkle, but the techniques are still the same.

Mr. F.

I appreciate your answer but the calendar is only 2 of 16 pages of the website. I have managed to complete one of the 3 websites I run but it is the simplest at one page, so far. This is the next site with 16 pages but my third site, while it also only has 16 pages, has over 1200 images with accompanying captions and info paragraphs and I do a weekly update to it. I’ll either need to learn how to do layouts really well or find an easier way to re-build it. Thanks for your help though!

So I am trying again to get the attributes to sync. They are not syncing. I attempted to force it by making it a style in “apply changes” but that changed the text on the entire page. Do they not sync or is there something I need to do to each layout to force them to sync?

Here is another example from a different layout.


@jimjumper, This has been going on for a while now and I see you going around in circles!

Questions…

  • Did you create the 1200 device first and all its pages before creating the 960?
  • Did you style your text before creating the 960 device?
  • Since creating the 960 are you only now going backward and forward restyling your text?

If you say no to any of these questions (plus a yes to the last) I would suggest kill all your other devices except 1200. Get the 1200 device styled correctly in how you want it and then reintroduce your 960 and go from there…

The 1200 is exactly the way I want and I have published it with auto scaling so at least I have something my club can use till I get things worked out. But if the sync feature is working as shown I should get an error indicator when the layout doesn’t match the 1200? I do have the benefit of a number of devices and can view errors between the devices after publishing that I don’t see in Preview but I can’t tell what does or doesn’t change between the layouts and the published site.

  • I would recommend to do all your testing in Preview for al your devices and get everything right.
  • Go back to your sever via FTP and kill everything on your host server.
  • Re publish your Sparkle website that looks correct on all your devices in Preview.

So I assume I’ll need do all the text colors for each layout I take it. :grinning:

Hmm, I just did some of the text color in 320 layout and it synced with all the layouts but the 1200.

No!..
You take the 1200 and do everything to it - layout, images, colours, font styles, and font colours. Once you have done everything on the 1200 including all the pages then you start with the next device.

The added devices will take on your font styles, you just have to adjust the size and update the style(s) for that device.

I would also minimise the differing font colours used and use bold, underline, or italic instead. If you insist in using those colours (please learn a little bit on colour psychology) then I would use seperate text boxes and style that font as “body - red” and “body - blue” so you have better control over it as per device.

@jimjumper, if that is the case then I would kill the 1200 and then reintroduce it again while in the 960 device while you do it.

Hello.

If I’m honest, I don’t understand what you’re doing. Also your setup for the different devices is a mystery to me.

If you haven’t made many pages yet, I would start from scratch with the 1200 px layout. First set all other devices to “not available”.

Now when you have everything set up the way you want it: font and size, color, etc. save all styles correctly. Make as many styles as you need.

Now check this layout in the preview. If everything fits, set the 960 px layout to “auto”. Now check this layout. It should be identical except that the fonts are smaller by a factor of 1.25. 20 pt becomes 16 pt. The images are also reduced in size.

Next step: Take the 768 layout and set it to “personalized”. Now everything will be even smaller. You may have to reposition text and images. And now the styles come into play again. The font size of 20 pt should now be 12 or 13. Now adjust it so that everything is legible. The style gets an asterisk *. Now click “Apply changes”. This style is then only valid for this one layout.

To be on the safe side, you can check the other layouts again in the preview. Everything should be unchanged.

That’s all I can say at the moment. The 480 px layout is actually unnecessary. I have set it to “not available” for my page.

Mr. F.

Success! Completed the 1200 and then individually edited the other layouts one by one and they are all done and published.
One minor question left, despite trying both “current device/All devices” and the two settings in Preview Availability in all 4 possible combinations the browser selection at the top of the Preview box never activates. The Safari box is checked but the line of boxes is inactive?

@jimjumper , Do you have those browsers onboard your iMac?