Alpha Software Mobile Development Tools:   Alpha Anywhere    |   Alpha TransForm subscribe to our YouTube Channel  Follow Us on LinkedIn  Follow Us on Twitter  Follow Us on Facebook

Announcement

Collapse

The Alpha Software Forum Participation Guidelines

The Alpha Software Forum is a free forum created for Alpha Software Developer Community to ask for help, exchange ideas, and share solutions. Alpha Software strives to create an environment where all members of the community can feel safe to participate. In order to ensure the Alpha Software Forum is a place where all feel welcome, forum participants are expected to behave as follows:
  • Be professional in your conduct
  • Be kind to others
  • Be constructive when giving feedback
  • Be open to new ideas and suggestions
  • Stay on topic


Be sure all comments and threads you post are respectful. Posts that contain any of the following content will be considered a violation of your agreement as a member of the Alpha Software Forum Community and will be moderated:
  • Spam.
  • Vulgar language.
  • Quotes from private conversations without permission, including pricing and other sales related discussions.
  • Personal attacks, insults, or subtle put-downs.
  • Harassment, bullying, threatening, mocking, shaming, or deriding anyone.
  • Sexist, racist, homophobic, transphobic, ableist, or otherwise discriminatory jokes and language.
  • Sexually explicit or violent material, links, or language.
  • Pirated, hacked, or copyright-infringing material.
  • Encouraging of others to engage in the above behaviors.


If a thread or post is found to contain any of the content outlined above, a moderator may choose to take one of the following actions:
  • Remove the Post or Thread - the content is removed from the forum.
  • Place the User in Moderation - all posts and new threads must be approved by a moderator before they are posted.
  • Temporarily Ban the User - user is banned from forum for a period of time.
  • Permanently Ban the User - user is permanently banned from the forum.


Moderators may also rename posts and threads if they are too generic or do not property reflect the content.

Moderators may move threads if they have been posted in the incorrect forum.

Threads/Posts questioning specific moderator decisions or actions (such as "why was a user banned?") are not allowed and will be removed.

The owners of Alpha Software Corporation (Forum Owner) reserve the right to remove, edit, move, or close any thread for any reason; or ban any forum member without notice, reason, or explanation.

Community members are encouraged to click the "Report Post" icon in the lower left of a given post if they feel the post is in violation of the rules. This will alert the Moderators to take a look.

Alpha Software Corporation may amend the guidelines from time to time and may also vary the procedures it sets out where appropriate in a particular case. Your agreement to comply with the guidelines will be deemed agreement to any changes to it.



Bonus TIPS for Successful Posting

Try a Search First
It is highly recommended that a Search be done on your topic before posting, as many questions have been answered in prior posts. As with any search engine, the shorter the search term, the more "hits" will be returned, but the more specific the search term is, the greater the relevance of those "hits". Searching for "table" might well return every message on the board while "tablesum" would greatly restrict the number of messages returned.

When you do post
First, make sure you are posting your question in the correct forum. For example, if you post an issue regarding Desktop applications on the Mobile & Browser Applications board , not only will your question not be seen by the appropriate audience, it may also be removed or relocated.

The more detail you provide about your problem or question, the more likely someone is to understand your request and be able to help. A sample database with a minimum of records (and its support files, zipped together) will make it much easier to diagnose issues with your application. Screen shots of error messages are especially helpful.

When explaining how to reproduce your problem, please be as detailed as possible. Describe every step, click-by-click and keypress-by-keypress. Otherwise when others try to duplicate your problem, they may do something slightly different and end up with different results.

A note about attachments
You may only attach one file to each message. Attachment file size is limited to 2MB. If you need to include several files, you may do so by zipping them into a single archive.

If you forgot to attach your files to your post, please do NOT create a new thread. Instead, reply to your original message and attach the file there.

When attaching screen shots, it is best to attach an image file (.BMP, .JPG, .GIF, .PNG, etc.) or a zip file of several images, as opposed to a Word document containing the screen shots. Because Word documents are prone to viruses, many message board users will not open your Word file, therefore limiting their ability to help you.

Similarly, if you are uploading a zipped archive, you should simply create a .ZIP file and not a self-extracting .EXE as many users will not run your EXE file.
See more
See less

Overlaying text

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Overlaying text

    I have this code on a page which pulls in an image for a header.

    Over laying this image I wish to lay some text for SEO (h1)

    <%a5 a5w_include("header.a5w")%>
    Can anyone please say how this is carried out?
    Thank you
    John

  • #2
    Re: Overlaying text

    What you are asking about requires using CSS, there is nothing in A5 that inherently allows you to overlay an image with text. Learning and using CSS requires as much work as learning A5.

    You can also use CSS to tag an image with text (for SEO) but not have the text visible. In this FileMaker website many of the images have associated text, but the text is positioned, using CSS, 'off the page' with negative margins.

    Much of the text at this website is text-overlaying graphics: http://www.trinav.com/. This page should show some items with "Sold" or "Reduced Price" tags over the photo image: http://trinav.com/list_vessels.a5w?s=ReducedVess.

    Taking the text in the upper right on the "map". The HTML is as follows, and the text comes from the database with lookup():

    HTML Code:
    <div id="map" style="WIDTH: 411px; POSITION: relative; HEIGHT: 304px">
     <div id="mapcontent"><%a5 ?lookup("[PathAlias.ADB_Path]\defaults",".t.","Sellyourboat") %>
     </div>
    </div>
    And the CSS file for the two DIV ID's:
    HTML Code:
    #map{
    height: 305px;
    width: 411px;
    margin-left: 5px;
    float: left;
    background: transparent url(../images/map.jpg) no-repeat;
    }
    
    #mapcontent{
    color:white;
    font-size:11px;
    line-height:1.4;
    margin-left:10px;
    margin-right:200px;
    margin-top:45px;
    }
    Last edited by Steve Wood; 03-25-2011, 12:42 PM.
    Steve Wood
    Join the ALPHA DEVELOPERS NETWORK
    There is no Cloud. It's just someone else's computer.
    Web - Mobile - Hosting - Products - Frameworks - Developer Resources
    AlphaToGo | IADN (100% Alpha Anywhere Websites)

    Comment


    • #3
      Re: Overlaying text

      Thanks Steve
      there is nothing in A5 that inherently allows you to overlay an image with text.
      Thats a shame guess I have been spoiled with Dreamweaver which is good at that sort of thing.

      John

      Comment


      • #4
        Re: Overlaying text

        Alpha's HTML Editor is not up to par with Dreamweaver, especially when you adopt CSS for your layouts. But the good news is that you get to become proficient at writing CSS code yourself:). I'm only being semi-humerous because I do believe it has helped me to apply CSS by hand in the last several Alpha applications.

        You CAN use Dreamweaver to create A5W pages, layout anyway. When it comes to inserting a component, you need to use Alpha's editor if you want to insert it. To work around this, I have often inserted the component in a draft page, and then copied over all the code to my final page. Again, that exercise taught me how the A5W pages work.
        Steve Wood
        Join the ALPHA DEVELOPERS NETWORK
        There is no Cloud. It's just someone else's computer.
        Web - Mobile - Hosting - Products - Frameworks - Developer Resources
        AlphaToGo | IADN (100% Alpha Anywhere Websites)

        Comment


        • #5
          Re: Overlaying text

          To emulate the above code
          I created a field in the defaults table called BoatParts
          I Entered Boat Parts in the field.
          When I publish the page I get no errors but cannot see the text "Boat Parts" which I am trying to get to show over the image. The image appears correctly.

          I placed the css code into styles.css
          #map{
          height: 305px;
          width: 411px;
          margin-left: 5px;
          float: left;
          background: transparent url(../images/map.jpg) no-repeat;
          }

          #mapcontent{
          color:white;
          font-size:11px;
          line-height:1.4;
          margin-left:10px;
          margin-right:200px;
          margin-top:45px;
          }

          The code for this section is
          <tr>
          <td colSpan=2>
          <img style="WIDTH: 940px; HEIGHT: 120px" height=100 src ="images/header.jpg" width=800>
          <div id="map" style="WIDTH: 411px; POSITION: relative; HEIGHT: 50px">
          <div id="mapcontent"><%a5 ?lookup("[PathAlias.ADB_Path]\defaults",".t.","BoatParts") %>
          </div>
          </div>
          </td>
          </tr>
          Can anyone say where I am going wrong please?
          Thanks
          John

          Comment


          • #6
            Re: Overlaying text

            Honestly, this is an area that is very difficult to debug in a forum. CSS is a complete study. Having said that, note that the text color in the CSS you/I posted is WHITE. So change it to black and maybe it will appear.
            Steve Wood
            Join the ALPHA DEVELOPERS NETWORK
            There is no Cloud. It's just someone else's computer.
            Web - Mobile - Hosting - Products - Frameworks - Developer Resources
            AlphaToGo | IADN (100% Alpha Anywhere Websites)

            Comment


            • #7
              Re: Overlaying text

              Thanks Steve
              I chose white because the image has a lot of blue.
              I tried with DW and that works OK but when the the code is placed in A5 the words refuse to sit over the image.

              Comment


              • #8
                Re: Overlaying text

                CSS also includes a setting named "z-index" and the image with the highest Z-index shows on top.

                So you might try adding z-index: 5; to map and z-index:10; to mapcontent.

                Pat
                Pat Bremkamp
                MindKicks Consulting

                Comment


                • #9
                  Re: Overlaying text

                  Thanks Pat
                  I tried the z index point but still cannot see the words.

                  Strange because I can see the words "Boat Parts" in the source code as follows.

                  <tr>
                  <td colSpan=2>
                  <img style="WIDTH: 940px; HEIGHT: 120px" height=100 src ="images/header.jpg" width=800>
                  <div id="map" style="WIDTH: 411px; POSITION: relative; HEIGHT: 50px">
                  <div id="mapcontent">Boat Parts </div>
                  </div>
                  </td>
                  </tr>

                  Comment


                  • #10
                    Re: Overlaying text

                    Originally posted by Steve Wood View Post
                    What you are asking about requires using CSS, there is nothing in A5 that inherently allows you to overlay an image with text. Learning and using CSS requires as much work as learning A5.

                    You can also use CSS to tag an image with text (for SEO) but not have the text visible. In this FileMaker website many of the images have associated text, but the text is positioned, using CSS, 'off the page' with negative margins.

                    Much of the text at this website is text-overlaying graphics: http://trinav.alphatogohost.com/

                    Taking the text in the upper right on the "map". The HTML is as follows, and the text comes from the database with lookup():

                    HTML Code:
                    <div id="map" style="WIDTH: 411px; POSITION: relative; HEIGHT: 304px">
                     <div id="mapcontent"><%a5 ?lookup("[PathAlias.ADB_Path]\defaults",".t.","Sellyourboat") %>
                     </div>
                    </div>
                    And the CSS file for the two DIV ID's:
                    HTML Code:
                    #map{
                    height: 305px;
                    width: 411px;
                    margin-left: 5px;
                    float: left;
                    background: transparent url(../images/map.jpg) no-repeat;
                    }
                    
                    #mapcontent{
                    color:white;
                    font-size:11px;
                    line-height:1.4;
                    margin-left:10px;
                    margin-right:200px;
                    margin-top:45px;
                    }
                    THANK YOU THANK YOU THANK YOU!!!!!!!!!!!!!!!!


                    Here's an add-on question - if my builders need to be able to download both PDF and jpegs, with the copyright text on it - can that be done without us having to add it in photoshop (which is what we currently do)? I'm guessing I can use Reports to get to the PDF, but jpegs? Possible?
                    Wendy Welton
                    Architect
                    past & future Alphaholic - deliberately falling off the wagon!

                    http://www.artformhomeplans.com/

                    Comment


                    • #11
                      Re: Overlaying text

                      Please check the response I gave in our own thread - CSS only visually overlays, but ImageMagick and a bit of XBasic coding can automate merging the two layers for you.

                      Comment


                      • #12
                        Re: Overlaying text

                        To get the copyright text on the image you have do what Andrea said to actually alter the image. For PDF's you should add a watermark, which can be done in Alpha somewhere, can't quite recall where.

                        If you want text superimposed over an image using CSS, I have improved that process at that Trinav website referenced below. I don't think you are asking how to do that here, but for future reference it superimposes words like SOLD, ON SALE, REDUCED PRICE, etc based on a Status field.
                        Steve Wood
                        Join the ALPHA DEVELOPERS NETWORK
                        There is no Cloud. It's just someone else's computer.
                        Web - Mobile - Hosting - Products - Frameworks - Developer Resources
                        AlphaToGo | IADN (100% Alpha Anywhere Websites)

                        Comment


                        • #13
                          Re: Overlaying text

                          Steve, the trinav site redirects to something called "Urban menu" for me. Is this intended?

                          Comment


                          • #14
                            Re: Overlaying text

                            Andrea - I went back and fixed the url in the previous post. It had been a staging location, fixed it to show the live site.
                            Steve Wood
                            Join the ALPHA DEVELOPERS NETWORK
                            There is no Cloud. It's just someone else's computer.
                            Web - Mobile - Hosting - Products - Frameworks - Developer Resources
                            AlphaToGo | IADN (100% Alpha Anywhere Websites)

                            Comment


                            • #15
                              Re: Overlaying text

                              Originally posted by Steve Wood View Post
                              Andrea - I went back and fixed the url in the previous post. It had been a staging location, fixed it to show the live site.
                              Thanks - very nice site :)

                              Comment

                              Working...
                              X